feat(Nav): add dark mode btn

src/components/Nav.vue

@@ -1,7 +1,28 @@
-<script lang="ts">
-export default {
-  data: () => ({
-    pages: [
+<script lang="ts" setup>
+// export default {
+//   data: () => ({
+//     pages: [
+//       {
+//         title: '教师',
+//         page: '/teachers',
+//       },
+//       {
+//         title: '事件',
+//         page: '/events',
+//       },
+//       {
+//         title: '文章',
+//         page: '/posts',
+//       },
+//       {
+//         title: '关于',
+//         page: '/about',
+//       },
+//     ],
+//   }),
+// }
+
+const pages = [
   {
     title: '教师',
     page: '/teachers',
@@ -18,9 +39,9 @@ export default {
     title: '关于',
     page: '/about',
   },
-    ],
-  }),
-}
+]
+
+const { t } = useI18n()
 </script>
 
 <template>
@@ -41,6 +62,11 @@ export default {
 
     <v-spacer />
 
+    <v-btn
+      class="mx-2" :title="t('button.toggle_dark')" :icon="isDark ? 'mdi-weather-night' : 'mdi-weather-sunny'"
+      @click="toggleDark()"
+    />
+
     <v-menu>
       <template #activator="{ props }">
         <v-app-bar-nav-icon v-bind="props" class="md:hidden!" />