merge master

[arvados-workbench2.git] / src / components / subprocess-filter / subprocess-filter.tsx

diff --git a/src/components/subprocess-filter/subprocess-filter.tsx b/src/components/subprocess-filter/subprocess-filter.tsx
index 58c33ee5f238939f6ce795abdaad596d6a4cadd6..36be50d96aff7bb7fa6ff718c05baaf503bf53ba 100644 (file)
--- a/src/components/subprocess-filter/subprocess-filter.tsx
+++ b/src/components/subprocess-filter/subprocess-filter.tsx
@@ -5,27 +5,24 @@
 import * as React from 'react';
 import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
 import { ArvadosTheme } from '~/common/custom-theme';
-import { Grid, Typography, Switch } from '@material-ui/core';
+import { Typography, Switch } from '@material-ui/core';
 
-type CssRules = 'grid' | 'label' | 'value' | 'switch';
+type CssRules = 'container' | 'label' | 'value';
 
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
-    grid: {
-        display: 'flex'
+    container: {
+        display: 'flex',
+        alignItems: 'center',
+        height: '20px'
     },
     label: {
         width: '86px',
         color: theme.palette.grey["500"],
-        textAlign: 'right'
+        textAlign: 'right',
     },
     value: {
         width: '24px',
-        paddingLeft: theme.spacing.unit
-    },
-    switch: {
-        '& span:first-child': {
-            height: '18px'
-        }
+        paddingLeft: theme.spacing.unit,
     }
 });
 
@@ -41,14 +38,14 @@ type SubprocessFilterProps = SubprocessFilterDataProps & WithStyles<CssRules>;
 
 export const SubprocessFilter = withStyles(styles)(
     ({ classes, label, value, key, checked, onToggle }: SubprocessFilterProps) =>
-        <Grid item className={classes.grid} md={12} lg={6} >
+        <div className={classes.container} >
             <Typography component="span" className={classes.label}>{label}:</Typography>
             <Typography component="span" className={classes.value}>{value}</Typography>
-            {onToggle && <Switch classes={{ root: classes.switch }}
+            {onToggle && <Switch
                 checked={checked}
                 onChange={onToggle}
                 value={key}
                 color="primary" />
             }
-        </Grid>
+        </div>
 );
\ No newline at end of file