Hide header and footer on phones.

src/components/Header.tsx

@@ -15,7 +15,7 @@ const Link: FC<LinkProps> = ({ to, children }) => (
 );
 
 const Header: FC = () => (
-  <header className="flex p-4 items-center">
+  <header className="hidden md:flex p-4 items-center w-full overflow-hidden">
     <h1
       className={
         "text-3xl font-bold text-yellow-800 bg-yellow-300 shadow " +

src/containers/Footer.tsx

@@ -11,7 +11,7 @@ const Footer: FC = () => {
   const socket = useSelector(selectSocket);
 
   return (
-    <footer className="flex items-center justify-center">
+    <footer className="hidden md:flex items-center justify-center">
       <SocketStatusPane socket={socket} />
       <LoginStatusPane login={login} />
     </footer>