Hide navbar on mobile

zefhub · Jul 8, 2022 · a1cb943 · a1cb943 · vercel · Jul 8, 2022
1 parent 5ed86be
commit a1cb943
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/components/HeaderNavbar.tsx b/components/HeaderNavbar.tsx
@@ -63,7 +63,7 @@ const HeaderNavbar: React.FC = () => {
   };
 
   return (
-    <header className="sticky top-0 h-12 border-b-2 border-gray-500 bg-white w-full mb-2 z-50">
+    <header className="sticky top-0 h-12 border-b-2 border-gray-500 bg-white w-full mb-2 z-50 navbar-header">
       <div className="max-w-screen-md ml-auto mr-auto">
         <div className="flex justify-between pt-2">
           <button

diff --git a/styles/global.scss b/styles/global.scss
@@ -25,3 +25,9 @@
     font-family: "IBM Plex Sans", sans-serif;
   }
 }
+
+.navbar-header {
+  @media only screen and (max-width: 600px) {
+    display: none;
+  }
+}