M frontend/components/Banner/index.tsx → frontend/components/Banner/index.tsx

@@ -17,20 +17,7 @@ const {message, open, onClear} = props;
   const classes = useStyles();
   const [bannerRef, {height}] = useElementSize();
   const setBannerHeight = useBannerStore(s => s.setBannerHeight);
-  const setBannerOffset = useBannerStore(s => s.setBannerOffset);
   useEffect(() => setBannerHeight({height}), [height]);
-
-  if (typeof document != 'undefined') {
-    useEventListener('scroll', () => {
-      const y = window.scrollY;
-      if (y > height) {
-        setBannerOffset({offset: 0});
-      }
-      if (y <= height) {
-        setBannerOffset({offset: height - y});
-      }
-    });
-  }
 
   if (!open) return null;
 
@@ -63,7 +50,8 @@ },
   clear: {
     position: 'absolute',
     right: '12px',
-    bottom: '0',
+    bottom: '50%',
+    transform: 'translateY(50%)',
     minWidth: '44px',
     padding: '12px',
     lineHeight: '1.4em',

M frontend/containers/DrawerMenu/styles.ts → frontend/containers/DrawerMenu/styles.ts

@@ -49,7 +49,7 @@ },
   }),
   drawerText: {
     position: 'relative',
-    fontSize: '0.7em',
+    fontSize: '11px',
     lineHeight: '1.1em',
     height: 'auto',
     display: 'flex',
@@ -59,7 +59,6 @@ 
     [theme.breakpoints.down('sm')]: {
       whiteSpace: 'nowrap',
       lineHeight: '.5em',
-      fontSize: '11px',
     },
   },
 }));

M frontend/pages/e/[uuid]/index.tsx → frontend/pages/e/[uuid]/index.tsx

@@ -1,5 +1,4 @@ 
 import {useState, useReducer, useEffect} from 'react';
-import Box from '@material-ui/core/Box';
 import {makeStyles, useTheme} from '@material-ui/core/styles';
 import {useTranslation} from 'react-i18next';
 import {initializeApollo} from '../../../lib/apolloClient';
@@ -47,7 +46,6 @@ const Event = (props: Props) => {
   const {eventUUID} = props;
   const bannerOffset = useBannerStore(s => s.offset);
   const classes = useStyles({bannerOffset});
-  const theme = useTheme();
   const {t} = useTranslation();
   const {user} = useProfile();
   const {data: {me: {profile: {vehicles = []} = {}} = {}} = {}, loading} =
@@ -64,7 +62,6 @@ const {data: {eventByUUID: event} = {}} = useEventByUuidQuery({
     pollInterval: POLL_INTERVAL,
     variables: {uuid: eventUUID},
   });
-  const matches = useMediaQuery(theme.breakpoints.down('sm'));
 
   const onSave = async e => {
     try {