#1289 Set font of controls only for circuit browser instead of changing

fonts for whole page
VirtualFlyBrain · Jan 14, 2022 · 555fbb8 · 555fbb8
1 parent 1df4870
commit 555fbb8
Showing 1 changed file with 13 additions and 21 deletions.
diff --git a/components/interface/VFBCircuitBrowser/Controls.js b/components/interface/VFBCircuitBrowser/Controls.js
@@ -37,23 +37,10 @@ const theme = createMuiTheme({
   overrides : {
     MuiSlider: {
       markLabelActive: { color: 'white' },
-      markLabel: { color: 'white' },
-      markActive: { color: 'red' }
-    },
-    MuiButton: {
-      label: {
-        fontSize: '12px',
-        fontFamily: ['Barlow Condensed', 'Khand', "sans-serif"]
-      },
-      button : { padding : "" }
+      markLabel: { color: 'white' }
     }
   },
-  typography: {
-    body1: {
-      fontSize: 15,
-      fontFamily : ['Barlow Condensed', 'Khand', "sans-serif"]
-    }
-  }
+  typography: { body1: { fontFamily : ['Barlow Condensed', 'Khand', "sans-serif"] } }
 });
 
 /**
@@ -104,13 +91,18 @@ const styles = theme => ({
     backgroundColor : "#0AB7FE",
     flexBasis: "100%",
     fontWeight : 600,
+    fontSize: '12px',
+    fontFamily: ['Barlow Condensed', 'Khand', "sans-serif"]
   },
   clearButton : {
     backgroundColor : "#E53935",
     flexBasis: "100%",
     fontWeight : 600,
+    fontSize: '12px',
+    fontFamily: ['Barlow Condensed', 'Khand', "sans-serif"]
   },
-  slider : { color: '#0AB7FE' }
+  slider : { color: '#0AB7FE' },
+  typography : { fontSize : "15px" }
 });
 
 /**
@@ -203,7 +195,7 @@ class AutocompleteResults extends Component {
             onChange={this.props.neuronTextfieldModified}
             onDelete={this.props.neuronTextfieldModified}
             inputProps={{ ...params.inputProps, id: this.props.index, style: { height : "20px", color: "white" ,paddingLeft : "10px", border : "none", backgroundColor: "#80808040" } }}
-            InputLabelProps={{ ...params.inputProps,style: { color: "white", paddingLeft : "10px" } }}
+            InputLabelProps={{ ...params.inputProps,style: { color: "white", paddingLeft : "10px", fontSize: "14px" } }}
           />
         )}
       />
@@ -507,7 +499,7 @@ class Controls extends Component {
               IconButtonProps={{ style: { padding : "0px", margin : "0px" } }}
             >
               <div className={classes.column}>
-                <Typography >Configure circuit</Typography>
+                <Typography classes={{ root : classes.typography }}>Configure circuit</Typography>
               </div>
             </AccordionSummary>
             <AccordionDetails classes={{ root : classes.details }}>
@@ -573,7 +565,7 @@ class Controls extends Component {
                       </IconButton>
                     </Grid>
                     <Grid item sm={10} classes={{ root : classes.addNeuron }}>
-                      <Typography>Add Neuron</Typography>
+                      <Typography classes={{ root : classes.typography }}>Add Neuron</Typography>
                     </Grid>
                   </Grid>
                 }
@@ -584,7 +576,7 @@ class Controls extends Component {
               <Grid container justify="space-between" alignItems="center" >
                 <Grid container spacing={1}>
                   <Grid item sm={3}>
-                    <Typography># Paths</Typography>
+                    <Typography classes={{ root : classes.typography }}># Paths</Typography>
                   </Grid>
                   <Grid item sm={9}>
                     <Slider
@@ -602,7 +594,7 @@ class Controls extends Component {
                 </Grid>
                 <Grid container spacing={1} alignItems="flex-end">
                   <Grid item sm={3}>
-                    <Typography>Min Weight</Typography>
+                    <Typography classes={{ root : classes.typography }}>Min Weight</Typography>
                   </Grid>
                   <Grid item sm={9}>
                     <Input className={classes.weightInputDiv} label="Graph weight" defaultValue={this.weight} onChange={this.weightChange} inputProps={{ 'aria-label': 'description', id : "weightField", className : classes.weightInput }} />