initial commit

webapp/src/App.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { RouterView } from 'vue-router'
+import { ref } from 'vue'
+
+const items = [
+  { title: 'Home', icon: 'mdi-home', to: '/' },
+  { title: 'About', icon: 'mdi-information', to: '/about' },
+]
+const drawer = ref(false)
+</script>
+
+<template>
+  <v-app>
+    <v-app-bar
+      flat
+      prominent
+    >
+      <v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
+
+      <v-toolbar-title>
+        <v-img height="36" width="200" src="/deflock-logo.png" />
+      </v-toolbar-title>
+
+      <v-spacer></v-spacer>
+
+      <template v-if="$vuetify.display.mdAndUp">
+        <v-btn icon="mdi-magnify" variant="text"></v-btn>
+
+        <v-btn icon="mdi-filter" variant="text"></v-btn>
+      </template>
+
+      <v-btn icon="mdi-dots-vertical" variant="text"></v-btn>
+    </v-app-bar>
+
+    <v-navigation-drawer
+      v-model="drawer"
+      temporary
+    >
+      <v-list nav>
+        <v-list-item
+          v-for="item in items"
+          :key="item.title"
+          link
+          :to="item.to"
+        >{{ item.title }}</v-list-item>
+      </v-list>
+    </v-navigation-drawer>
+
+    <v-main>
+      <RouterView />
+    </v-main>
+  </v-app>
+</template>