Build and CSS fixes.

src/components/Navbar.tsx

@@ -1,12 +1,11 @@
 import styled from 'styled-components';
 
 const Navbar = styled.div`
-    padding: 8px 12px;
     font-size: 20px;
     line-height: 2rem;
     background-color: #111;
     color: #fff;
-    min-height: 56px;
+    min-height: 64px;
     display: flex;
     align-items: center;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);

src/pages/_app.tsx

@@ -145,10 +145,10 @@ const GlobalStyles = createGlobalStyle`
     } 
     .bm-burger-button {
         position: fixed;
-        width: 28px;
-        height: 20px;
-        left: 36px;
-        margin-top: 30px;
+        width: 26px;
+        height: 22px;
+        left: 16px;
+        top: 22px;
     }
     .bm-burger-bars {
         background: #bdbdbd;
@@ -169,10 +169,10 @@ const Image = styled.img`
     margin-right: 5px;
 `;
 
-const FlexContainer = styled.div`
+const FlexContainer = styled.div<{sideMargin: boolean}>`
     flex: 1;
     text-align: center;
-    margin: 16px;
+    ${props => props.sideMargin && 'margin-left: 48px;'}
 `;
 
 sentryInit();
@@ -235,7 +235,7 @@ export default function App({ Component, pageProps, err }) {
                 <Sidebar setNavbarIconView={setNavbarIconView} />
             </div>
             <Navbar>
-                <FlexContainer>
+                <FlexContainer sideMargin={navbarIconView}>
                     <Image
                         style={{ height: '24px' }}
                         alt="logo"

src/pages/gallery/components/PreviewCard.tsx

@@ -125,7 +125,7 @@ export default function PreviewCard(props: IProps) {
         }
     };
 
-    const handleSelect = (e: SyntheticEvent<HTMLInputElement>) => {
+    const handleSelect: React.ChangeEventHandler<HTMLInputElement> = (e) => {
         e.stopPropagation();
         onSelect?.(e.target.checked);
     }
@@ -141,7 +141,7 @@ export default function PreviewCard(props: IProps) {
             selected={selected}
             {...(selectable ? useLongPress(longPressCallback,500) : {})}
         >
-            {selectable && <Check type='checkbox' checked={selected} onClick={handleSelect}/>}
+            {selectable && <Check type='checkbox' checked={selected} onChange={handleSelect}/>}
             {(data?.msrc || imgSrc) && <img src={data?.msrc || imgSrc} />}
             {data?.metadata.fileType === 1 && <PlayCircleOutline />}
         </Cont>

src/pages/gallery/index.tsx

@@ -25,7 +25,7 @@ import {
 import constants from 'utils/strings/constants';
 import AlertBanner from './components/AlertBanner';
 import { Alert, Button, Jumbotron } from 'react-bootstrap';
-import Delete from 'components/delete';
+import Delete from 'components/Delete';
 
 const DATE_CONTAINER_HEIGHT = 45;
 const IMAGE_CONTAINER_HEIGHT = 200;