refactor: menu for new page structure

src/.vuepress/components/Bar.vue

@@ -2,36 +2,87 @@
   <v-card
     flat
   >
-  <!-- <v-app-bar
-    app
-    color="primary"
-    dense
-    dark
-    flat
-    fixed
-  > -->
-      <v-tabs 
-        align-with-title
-        hide-slider
-        background-color="primary"
-        class="rounded-0"
-        dark
-        role="navigation"
-        >
-        <!-- <v-tabs-slider color="white"></v-tabs-slider> -->
-        <v-tab to="/">
-          Ahiqar
-        </v-tab>
-        <v-tab to="/edition.html">
-          Edition
-        </v-tab>
-        <v-tab to="/syriac.html">
-          Syriac
-        </v-tab>
-        <v-tab to="/arabic.html">
-          Arabic
-        </v-tab>
-      </v-tabs>
+    <v-tabs 
+      align-with-title
+      hide-slider
+      background-color="primary"
+      class="rounded-0"
+      dark
+      role="navigation"
+      >
+      <v-tab to="/">
+        Ahiqar
+      </v-tab>
+      <v-tab>
+        <v-menu offset-y>
+          <template v-slot:activator="{ on, attrs }">
+            <v-btn
+              color="primary"
+              dark
+              depressed
+              v-bind="attrs"
+              v-on="on"
+            >
+              Meta Edition
+            </v-btn>
+          </template>
+          <v-list>
+            <v-list-item
+              v-for="(item, index) in metaEdition"
+              :key="index"
+              :to="item.to"
+            >
+              <v-list-item-title>{{ item.title }}</v-list-item-title>
+            </v-list-item>
+          </v-list>
+        </v-menu>
+      </v-tab>
+      <v-tab>
+        <v-menu offset-y>
+          <template v-slot:activator="{ on, attrs }">
+            <v-btn
+              color="primary"
+              dark
+              depressed
+              v-bind="attrs"
+              v-on="on"
+            >
+              Editions
+            </v-btn>
+          </template>
+          <v-list>
+            <v-list-item
+              v-for="(item, index) in editions"
+              :key="index"
+              :to="item.to"
+            >
+              <v-list-item-title>{{ item.title }}</v-list-item-title>
+            </v-list-item>
+          </v-list>
+        </v-menu>
+      </v-tab>
+      <v-tab to="/project.html">
+        Project
+      </v-tab>
+    </v-tabs>
   </v-card>
-  <!-- </v-app-bar> -->
 </template>
+
+<script>
+  export default {
+    data: () => ({
+      editions: [
+        { title: 'Syriac Texts', to: '/' },
+        { title: 'Arabic and Kashuni Texts', to: '/' },
+      ],
+      metaEdition: [
+        { title: 'Manuscripts', to: '/manuscripts.html' },
+        { title: 'Motifs', to: '/motifs.html' },
+        { title: 'Stemmata', to: '/stemmata.html' },
+        { title: 'Collation', to: '/collation.html' },
+        { title: 'Edition guidelines', to: '/editionguidelines.html' },
+        { title: 'Related Literature', to: '/relatedliterature.html' },
+      ],
+    }),
+  }
+</script>