increase size of buttons again

client/src/pages/views/OperatorViewPage.tsx

@@ -284,11 +284,11 @@ const OperatorViewPage: React.FC = () => {
           {activeViewTypeId && <SlideDisplay variant="presentation" activeViewTypeId={activeViewTypeId} />}
         </OperatorInnerContent>
       </OperatorContent>
-      {<div style={{ minHeight: 96 }} />}
+      {<div style={{ minHeight: 128 }} />}
       <OperatorFooter position="fixed">
         <Tooltip title="Föregående sida" arrow>
           <OperatorButton onClick={handleSetPrevSlide} variant="contained" disabled={isFirstSlide} color="primary">
-            <ChevronLeftIcon fontSize="small" />
+            <ChevronLeftIcon fontSize="large" />
           </OperatorButton>
         </Tooltip>
 
@@ -300,7 +300,7 @@ const OperatorViewPage: React.FC = () => {
               disabled={timer.value !== null && !timer.enabled}
               color="primary"
             >
-              <TimerIcon fontSize="small" />
+              <TimerIcon fontSize="large" />
               <Timer disableText />
             </OperatorButton>
           </Tooltip>
@@ -308,20 +308,20 @@ const OperatorViewPage: React.FC = () => {
 
         <Tooltip title="Visa ställning för publik" arrow>
           <OperatorButton onClick={() => socketSync({ show_scoreboard: true })} variant="contained" color="primary">
-            <AssignmentIcon fontSize="small" />
+            <AssignmentIcon fontSize="large" />
           </OperatorButton>
         </Tooltip>
         {showScoreboard && <Scoreboard isOperator />}
 
         <Tooltip title="Visa koder" arrow>
           <OperatorButton onClick={handleOpenCodes} variant="contained" color="primary">
-            <SupervisorAccountIcon fontSize="small" />
+            <SupervisorAccountIcon fontSize="large" />
           </OperatorButton>
         </Tooltip>
 
         <Tooltip title="Nästa sida" arrow>
           <OperatorButton onClick={handleSetNextSlide} variant="contained" disabled={isLastSlide} color="primary">
-            <ChevronRightIcon fontSize="small" />
+            <ChevronRightIcon fontSize="large" />
           </OperatorButton>
         </Tooltip>
       </OperatorFooter>

client/src/pages/views/styled.tsx

@@ -50,7 +50,7 @@ export const OperatorFooter = styled(AppBar)`
   flex-direction: row;
   justify-content: center;
   align-items: center;
-  height: 96px;
+  height: 128px;
   top: auto;
   bottom: 0;
   width: 100%;
@@ -62,8 +62,8 @@ export const OperatorQuitButton = styled(Button)`
 `
 
 export const OperatorButton = styled(Button)`
-  min-width: 64px;
-  min-height: 64px;
+  min-width: 90px;
+  min-height: 90px;
   margin-left: 16px;
   margin-right: 16px;
 `
@@ -147,7 +147,7 @@ export const OperatorInnerContent = styled.div`
   width: 100%;
   /* Makes sure width is not bigger than where a 16:9 display can fit 
   without overlapping with header and footer */
-  max-width: calc(((100vh - 160px) / 9) * 16);
+  max-width: calc(((100vh - 192px) / 9) * 16);
 `
 
 export const PresentationContainer = styled.div`