Fix some accessibility issues

src/client/components/App.js

 import React from 'react'
 import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
 import SemanticPortal from '../containers/SemanticPortal'
-import deepPurple from '@material-ui/core/colors/deepPurple'
 
 const theme = createMuiTheme({
   palette: {
-    primary: deepPurple
+    primary: {
+      main: '#212121'
+    },
+    secondary: {
+      main: '#f44336' 
+    }
   },
   overrides: {
     MuiTooltip: {

src/client/components/perspectives/sampo/Footer.js

@@ -53,27 +53,27 @@ const useStyles = makeStyles(theme => ({
     display: 'flex',
     alignItems: 'center'
   },
-  logo: props => ({
-    height: 40,
-    [theme.breakpoints.up(props.layoutConfig.reducedHeightBreakpoint)]: {
-      height: 40
-    }
-  }),
   aaltoLogo: props => ({
+    width: 143,
     height: 29,
     [theme.breakpoints.up(props.layoutConfig.reducedHeightBreakpoint)]: {
+      width: 167,
       height: 34
     }
   }),
   hyLogo: props => ({
+    width: 157,
     height: 42,
     [theme.breakpoints.up(props.layoutConfig.reducedHeightBreakpoint)]: {
+      width: 168,
       height: 45
     }
   }),
   heldigLogo: props => ({
+    width: 118,
     height: 30,
     [theme.breakpoints.up(props.layoutConfig.reducedHeightBreakpoint)]: {
+      width: 130,
       height: 33
     }
   })

src/client/components/perspectives/sampo/TopBar.js

@@ -89,11 +89,15 @@ const useStyles = makeStyles(theme => ({
   mainLogoTypography: {
     whiteSpace: 'nowrap',
     [theme.breakpoints.down('sm')]: {
-      fontSize: '1rem'
+      fontSize: '1.25rem',
+      fontWeight: 600
     }
     // [theme.breakpoints.down('xs')]: {
     //     display: 'none'
     // }
+  },
+  mobileMenuButton: {
+    padding: 12
   }
 }))
 
@@ -304,7 +308,11 @@ const TopBar = props => {
                 loadLocales={props.loadLocales}
                 location={props.location}
               />}
-            <IconButton aria-haspopup='true' onClick={handleMobileMenuOpen} color='inherit'>
+            <IconButton
+              aria-label='display more actions' color='inherit'
+              className={classes.mobileMenuButton}
+              onClick={handleMobileMenuOpen}
+            >
               <MoreIcon />
             </IconButton>
           </div>

src/client/configs/sampo/GeneralConfig.js

@@ -37,7 +37,8 @@ export const layoutConfig = {
   topBar: {
     showLanguageButton: true,
     feedbackLink: 'https://link.webropolsurveys.com/',
-    reducedHeight: 44,
+    // 48 px is minimun for tab targets: https://web.dev/tap-targets/?utm_source=lighthouse&utm_medium=devtools#how-to-fix-your-tap-targets
+    reducedHeight: 48,
     defaultHeight: 64,
     mobileMenuBreakpoint: 1360
   },