add section header

src/components/categorical/categorical.js

@@ -1,5 +1,6 @@
 import React from "react";
 import _ from "lodash";
+import { connect } from "react-redux";
 import * as globals from "../../globals";
 
 import cells from "../../../data/GBM_metadata.js";
@@ -52,6 +53,7 @@ const Categorical = () => {
       }
     </div>
   )
+        <SectionHeader text="Categorical Metadata"/>
 };
 
 export default Categorical;

src/components/continuous/continuous.js

@@ -4,6 +4,7 @@ import cells from "../../../data/GBM_metadata.js";
 import drawParallelCoordinates from "./drawParallelCoordinates";
 import createContinuousRanges from "./createContinuousRanges";
 import styles from './parallelCoordinates.css';
+import SectionHeader from "../framework/sectionHeader";
 
 import {
   margin,
@@ -28,7 +29,7 @@ class Continuous extends React.Component {
   render() {
     return (
       <div id="parcoords_wrapper" style={{marginTop: 50}}>
-        <h3> Continuous Metadata </h3>
+        <SectionHeader text="Continuous Metadata"/>
         <div style={{marginBottom: 30}}>
           Color By:
           <button style={{marginLeft: 10}}>Cluster_2d_color</button>
@@ -48,10 +49,12 @@ class Continuous extends React.Component {
             width:  width + margin.left + margin.right + "px",
             height: height + margin.top + margin.bottom + "px"
           }}></div>
-        <pre id="parcoords_output" className={styles.pre}></pre>
       </div>
     )
   }
 };
 
 export default Continuous;
+
+/* text appended to parellel coords giving N instances of selection */ 
+// <pre id="parcoords_output" className={styles.pre}></pre>

src/components/framework/sectionHeader.js

@@ -0,0 +1,12 @@
+import React from 'react';
+
+const SectionHeader = ({text}) => (
+  <p style={{
+    fontSize: 32,
+    fontWeight: 700
+  }}>
+    {text}
+  </p>
+);
+
+export default SectionHeader;

src/components/graph/graph.js

@@ -2,6 +2,7 @@ import React from 'react';
 import _ from "lodash";
 import styles from "./graph.css";
 import {setupGraphElements, drawGraph} from "./drawGraph";
+import SectionHeader from "../framework/sectionHeader";
 
 class Graph extends React.Component {
 
@@ -38,7 +39,7 @@ class Graph extends React.Component {
   render() {
     return (
       <div id="graphWrapper">
-        <h3> Graph </h3>
+        <SectionHeader text="Graph"/>
         <div id="graphAttachPoint"> </div>
       </div>
     )