X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/5cc899fc13465c57f16adf69a593a4354e6e0eb3..578c6026645cda9432f3386f29521075b8526609:/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 f1366858..1722de8f 100644
--- a/src/components/subprocess-filter/subprocess-filter.tsx
+++ b/src/components/subprocess-filter/subprocess-filter.tsx
@@ -2,20 +2,18 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
+import 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 { ArvadosTheme } from 'common/custom-theme';
+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: {
+    container: {
         display: 'flex',
-        height: '20px',
-        paddingTop: '0px!important',
-        paddingBottom: '0px!important',
-        marginBottom: theme.spacing.unit
+        alignItems: 'center',
+        height: '20px'
     },
     label: {
         width: '86px',
@@ -25,12 +23,6 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     value: {
         width: '24px',
         paddingLeft: theme.spacing.unit,
-    },
-    switch: {
-        height: '20px',
-        '& span:first-child': {
-            height: '18px'
-        }
     }
 });
 
@@ -46,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