added some test pages to the frontend

frontend/src/layouts/MainLayout.vue

@@ -1,7 +1,65 @@
 <template>
-  <q-layout view="lHh Lpr lFf">
+  <q-layout view="hHh Lpr fFf">
+
+    <!-- HEADER -->
+    <q-header elevated>
+      <q-toolbar>
+        <q-btn flat dense round icon="menu" @click="drawer = !drawer" />
+        <q-toolbar-title>Hackathon 25 | Digitale Helfer für Dart</q-toolbar-title>
+      </q-toolbar>
+    </q-header>
+
+    <!-- SIDEBAR / DRAWER -->
+    <q-drawer v-model="drawer" show-if-above bordered>
+      <q-list>
+
+        <q-item clickable v-ripple to="/">
+          <q-item-section>
+            Home
+          </q-item-section>
+        </q-item>
+
+        <q-expansion-item
+          label="Tests"
+          icon="folder"
+          dense
+          expand-separator
+          switch-toggle-side
+        >
+          <q-list padding>
+
+            <q-item clickable v-ripple to="/test_DartPicker">
+              <q-item-section>
+                Dart Picker
+              </q-item-section>
+            </q-item>
+
+            <q-item clickable v-ripple to="/test_NumbersPage">
+              <q-item-section>
+                Numbers Input
+              </q-item-section>
+            </q-item>
+
+            <q-item clickable v-ripple to="/test_WebSpeechApi">
+              <q-item-section>
+                Web Speech Api
+              </q-item-section>
+            </q-item>
+
+          </q-list>
+        </q-expansion-item>
+      </q-list>
+    </q-drawer>
+
+    <!-- PAGE CONTAINER -->
     <q-page-container>
       <router-view />
     </q-page-container>
+
   </q-layout>
-</template>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const drawer = ref(false)
+</script>