hide menu button on big screens

RopeScore · Jul 14, 2024 · 0a14978 · 0a14978
1 parent 62dcc97
commit 0a14978
Showing 1 changed file with 13 additions and 11 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -20,17 +20,19 @@
           {{ menuItem.title }}
         </button-link>
       </nav>
-      <dialog-button ref="menuDialog" label="Menu">
-        <div class="flex flex-col gap-6">
-          <button-link
-            v-for="menuItem of menuItems"
-            :key="menuItem.title"
-            :to="menuItem.path"
-          >
-            {{ menuItem.title }}
-          </button-link>
-        </div>
-      </dialog-button>
+      <nav class="block lg:hidden">
+        <dialog-button ref="menuDialog" label="Menu">
+          <div class="flex flex-col gap-6">
+            <button-link
+              v-for="menuItem of menuItems"
+              :key="menuItem.title"
+              :to="menuItem.path"
+            >
+              {{ menuItem.title }}
+            </button-link>
+          </div>
+        </dialog-button>
+      </nav>
     </header>
 
     <main v-if="!fullscreen" class="px-2 py-4">