Fix permission select styles

Feature #14365

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>

diff --git a/src/views-components/sharing-dialog/permission-select.tsx b/src/views-components/sharing-dialog/permission-select.tsx
index a2d029827a409cf245e3eb898f9046fcdc207e12..c16c4837714668eed88a05e13ff9e6c331006f6f 100644 (file)
--- a/src/views-components/sharing-dialog/permission-select.tsx
+++ b/src/views-components/sharing-dialog/permission-select.tsx
@@ -44,12 +44,15 @@ export const PermissionSelect = withStyles(PermissionSelectStyles)(
 const renderPermissionItem = (value: string) =>
     <PermissionItem {...{ value }} />;
 
-type PermissionItemClasses = 'value';
+type PermissionItemClasses = 'value' | 'icon';
 
 const permissionItemStyles: StyleRulesCallback<PermissionItemClasses> = theme => ({
     value: {
         marginLeft: theme.spacing.unit,
     },
+    icon: {
+        margin: `-${theme.spacing.unit / 2}px 0`
+    }
 });
 
 const PermissionItem = withStyles(permissionItemStyles)(
@@ -57,7 +60,7 @@ const PermissionItem = withStyles(permissionItemStyles)(
         const Icon = getIcon(value);
         return (
             <Grid container alignItems='center'>
-                <Icon />
+                <Icon className={classes.icon} />
                 <span className={classes.value}>
                     {value}
                 </span>