styled panel-collapse icon Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox@curii...

diff --git a/src/views-components/main-app-bar/main-app-bar.tsx b/src/views-components/main-app-bar/main-app-bar.tsx
index fd0bc6ca2614ab4e65bff5ddd086dd2763efe924..86aed88f1e1e893f9c39b2ed72cf55c03bdb42cc 100644 (file)
--- a/src/views-components/main-app-bar/main-app-bar.tsx
+++ b/src/views-components/main-app-bar/main-app-bar.tsx
@@ -16,7 +16,6 @@ import { ReactNode } from "react";
 import { AdminMenu } from "views-components/main-app-bar/admin-menu";
 import { pluginConfig } from 'plugins';
 import { CollapseLeftPanelTrigger } from 'views-components/side-panel/side-panel'
-// import { toggleSidePanel } from "store/store";
 
 type CssRules = 'toolbar' | 'link';
 
@@ -26,7 +25,8 @@ const styles: StyleRulesCallback<CssRules> = () => ({
         color: 'inherit'
     },
     toolbar: {
-        height: '56px'
+        height: '56px',
+        paddingLeft: '0'
     }
 });
 
@@ -46,7 +46,7 @@ export const MainAppBar = withStyles(styles)(
     (props: MainAppBarProps) => {
         return <AppBar position="absolute">
             <Toolbar className={props.classes.toolbar}>
-                <CollapseLeftPanelTrigger sidepanelcollapsed={props.sidePanelIsCollapsed} 
+                <CollapseLeftPanelTrigger sidePanelIsCollapsed={props.sidePanelIsCollapsed} 
                 toggleSidePanel={props.toggleSidePanel}
                 />
                 <Grid container justify="space-between">

diff --git a/src/views-components/side-panel/side-panel.tsx b/src/views-components/side-panel/side-panel.tsx
index 3c4d19f878498e144625e34648a6e39ce811391c..b4caef23d0f177cf5730189baa9f024764549129 100644 (file)
--- a/src/views-components/side-panel/side-panel.tsx
+++ b/src/views-components/side-panel/side-panel.tsx
@@ -13,8 +13,6 @@ import { Grid, Tooltip, IconButton  } from '@material-ui/core';
 import { SidePanelButton } from 'views-components/side-panel-button/side-panel-button';
 import { RootState } from 'store/store';
 import MenuIcon from "@material-ui/icons/Menu";
-// import { IconButtonProps } from '@material-ui/core/IconButton';
-// import { toggleSidePanel } from 'store/store';
 
 const DRAWER_WIDTH = 240;
 
@@ -49,10 +47,23 @@ export const SidePanel = withStyles(styles)(
             </Grid>
     ));
 
-export const CollapseLeftPanelTrigger = (props) =>{ 
+type collapseButtonIconProps = {
+    sidePanelIsCollapsed: boolean;
+    toggleSidePanel: (collapsedState: boolean) => void
+}
+
+const collapseButtonIconStyles = {
+    menuIcon: {
+        height: '4rem',
+        width: '4rem', 
+        paddingBottom: '0.25rem'
+    }
+}
+
+export const CollapseLeftPanelTrigger = (props: collapseButtonIconProps) =>{ 
     return <Tooltip disableFocusListener title="Toggle Side Panel">
-                <IconButton onClick={()=>{props.toggleSidePanel(props.sidepanelcollapsed)}}>
-                    <MenuIcon aria-label="Toggle Side Panel" />
+                <IconButton onClick={()=>{props.toggleSidePanel(props.sidePanelIsCollapsed)}}>
+                    <MenuIcon style={collapseButtonIconStyles.menuIcon} aria-label="Toggle Side Panel" />
                 </IconButton>
             </Tooltip>
     };
\ No newline at end of file

diff --git a/src/views/workbench/workbench.tsx b/src/views/workbench/workbench.tsx
index 030ed6df9ac7f6cce62d385638b97f0dfe47c686..35105e56ccc02b265050cfaad9a51b7d15e0e03d 100644 (file)
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@ -99,7 +99,6 @@ import { RestoreCollectionVersionDialog } from 'views-components/collections-dia
 import { WebDavS3InfoDialog } from 'views-components/webdav-s3-dialog/webdav-s3-dialog';
 import { pluginConfig } from 'plugins';
 import { ElementListReducer } from 'common/plugintypes';
-// import { toggleSidePanel } from 'store/store'
 
 type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content';