adding side navigator and device icon

src/app/Header.tsx

@@ -3,13 +3,13 @@ import { Menu } from "@mui/icons-material";
 import classNames from "classnames";
 import { makeStyles } from "@mui/styles";
 import { getDarkLogo, getLightLogo, getSignatureAccentColour, hasTransparentLogoBG, hideLogo } from "../services/whiteLabel";
-import { Link } from "react-router-dom";
+// import { Link } from "react-router-dom";
 import { useThemeType } from "../hooks/useThemeType";
 import UserMenu from "../user/UserMenu";
 
 const useStyles = makeStyles((theme: Theme) => ({
     appBar: {
-        zIndex: theme.zIndex.drawer + 1
+        zIndex: theme.zIndex.drawer + 1,
     },
     toolbar: {
         marginLeft: theme.spacing(0.5),
@@ -31,8 +31,12 @@ const useStyles = makeStyles((theme: Theme) => ({
     },
     logoContainer: {
         display: "flex",
-        alignItems: "flex-end",
-        justifyContent: "flex-start"
+        alignItems: "center",
+        height: "56px",
+        justifyContent: "flex-start",
+        [theme.breakpoints.up("md")]: {
+            height: "64px"
+        }
     },
     logoLink: {
         display: "flex",
@@ -43,7 +47,7 @@ const useStyles = makeStyles((theme: Theme) => ({
           ? ""
           : theme.palette.mode === "light"
           ? "#fff"
-          : "#323232"
+          : "#0000"
     },
     HeaderLogo: {
         objectFit: "cover",
@@ -77,6 +81,7 @@ interface Props {
 export default function Header(props: Props) {
 
     const { sideIsOpen, openSide, toggleTheme } = props;
+    // const { mode, setMode } = useColorScheme();
 
     const themeType = useThemeType();
     const classes = useStyles() 
@@ -86,13 +91,13 @@ export default function Header(props: Props) {
             <Toolbar disableGutters className={classes.toolbar}>
                 <Box className={classes.buttonContainer}>
                     {/* {!isMobile && ( */}
-                        <IconButton
-                            color="inherit"
-                            aria-label="Open side menu"
-                            onClick={openSide}
-                            className={classNames(classes.button, sideIsOpen && classes.hide)}>
-                                <Menu />
-                        </IconButton>
+                    <IconButton
+                        color="inherit"
+                        aria-label="Open side menu"
+                        onClick={openSide}
+                        className={classNames(classes.button, sideIsOpen && classes.hide)}>
+                            <Menu />
+                    </IconButton>
                     {/* )} */}
                 </Box>
                 <Box flexGrow={1} marginLeft={0.5}>