fix(docs): bad router link active detection

docs/.vitepress/components/Home.vue

@@ -37,15 +37,17 @@ const { t } = useI18n()
     </section>
 
     <div class="absolute inset-0 overflow-hidden -z-10">
-      <div class="absolute bottom-0 left-0 right-0 z-2 h-full from-transparent to-white bg-gradient-to-t dark:to-[hsl(207_15%_5%)]" />
+      <div class="absolute bottom-0 left-0 right-0 top-10 z-2 h-full from-transparent to-white bg-gradient-to-t dark:to-[hsl(207_15%_5%)]" />
       <img
         :src="homeCover"
         alt="Project AIRI Cover Image"
         :class="[
-          'absolute top-2rem md:top-8dvh lg:top-32dvh xl:top-20dvh left-1/2 -translate-x-1/2 max-w-none object-cover z-1',
-          'w-[160%] translate-y-[25%] -rotate-20',
-          'md:w-[120%] md:translate-y-[20%] md:rotate-[-15deg]',
-          'lg:w-[95%] lg:translate-y-[5%] lg:rotate-[-10deg]',
+          'absolute left-1/2 -translate-x-1/2 max-w-none object-cover z-1',
+          'w-[160%] translate-y-[25%] -rotate-20 top-8rem',
+          'md:w-[120%] md:translate-y-[20%] md:rotate-[-15deg] md:top-8dvh',
+          'lg:w-[95%] lg:translate-y-[5%] lg:rotate-[-10deg] lg:top-32dvh',
+          'xl:top-18dvh',
+          '2xl:top-16dvh',
         ]"
       >
     </div>

docs/.vitepress/components/Navbar.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { Icon } from '@iconify/vue'
+import { dirname, sep } from 'pathe'
 import { DropdownMenuContent, DropdownMenuItem, DropdownMenuPortal, DropdownMenuRoot, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Separator } from 'reka-ui'
 import { useData, useRoute } from 'vitepress'
 import { ref, toRefs, watch } from 'vue'
@@ -19,6 +20,14 @@ const isPopoverOpen = ref(false)
 watch(path, () => {
   isPopoverOpen.value = false
 })
+
+function isNavLinkActive(link: string, path: string) {
+  let normalizedLink = link.toLowerCase()
+  normalizedLink = normalizedLink.split(sep).filter(Boolean).length > 2 ? `${dirname(normalizedLink)}/` : normalizedLink
+
+  const normalizedPath = path.toLowerCase()
+  return normalizedPath.includes(normalizedLink)
+}
 </script>
 
 <template>
@@ -32,7 +41,7 @@ watch(path, () => {
         :href="nav.link"
         class="text-muted-foreground hover:text-foreground mx-3 h-full inline-flex items-center py-2 text-nowrap text-sm font-semibold"
         transition-colors duration-200 ease-in-out
-        :class="{ '!text-primary': path.includes(nav.text.toLowerCase()) }"
+        :class="{ '!text-primary': isNavLinkActive(nav.link, path) }"
       >
         {{ nav.text }}
       </a>

docs/.vitepress/config.ts

@@ -74,7 +74,7 @@ export default defineConfig({
       themeConfig: {
         // https://vitepress.dev/reference/default-theme-config
         nav: [
-          { text: 'Docs', link: withBase('/en/overview/') },
+          { text: 'Docs', link: withBase('/en/docs/overview/') },
           { text: 'Blog', link: withBase('/en/blog/') },
           {
             text: `v${version}`,
@@ -93,22 +93,22 @@ export default defineConfig({
             text: 'Overview',
             icon: 'lucide:rocket',
             items: [
-              { text: 'Introduction', link: withBase('/en/overview/') },
-              { text: 'About AI VTuber', link: withBase('/en/overview/about-ai-vtuber') },
-              { text: 'About Neuro-sama', link: withBase('/en/overview/about-neuro-sama') },
+              { text: 'Introduction', link: withBase('/en/docs/overview/') },
+              { text: 'About AI VTuber', link: withBase('/en/docs/overview/about-ai-vtuber') },
+              { text: 'About Neuro-sama', link: withBase('/en/docs/overview/about-neuro-sama') },
             ],
           },
           {
             text: 'Guides',
             icon: 'lucide:book-open',
             items: [
-              { text: 'Contributing', link: withBase('/en/guides/contributing/') },
+              { text: 'Contributing', link: withBase('/en/docs/guides/contributing/') },
               {
                 text: 'Design Guidelines',
-                link: withBase('/en/guides/design-guidelines/'),
+                link: withBase('/en/docs/guides/design-guidelines/'),
                 items: [
-                  { text: 'Resources', link: withBase('/en/guides/contributing/design-guidelines/resources') },
-                  { text: 'Tools', link: withBase('/en/guides/contributing/design-guidelines/tools') },
+                  { text: 'Resources', link: withBase('/en/docs/guides/contributing/design-guidelines/resources') },
+                  { text: 'Tools', link: withBase('/en/docs/guides/contributing/design-guidelines/tools') },
                 ],
               },
             ],
@@ -116,10 +116,10 @@ export default defineConfig({
           {
             text: 'Chronicles',
             icon: 'lucide:calendar-days',
-            link: withBase('/en/chronicles/'),
+            link: withBase('/en/docs/chronicles/'),
             items: [
-              { text: 'Before Story v0.0.1', link: withBase('/en/chronicles/version-v0.0.1/') },
-              { text: 'Initial Publish v0.1.0', link: withBase('/en/chronicles/version-v0.1.0/') },
+              { text: 'Before Story v0.0.1', link: withBase('/en/docs/chronicles/version-v0.0.1/') },
+              { text: 'Initial Publish v0.1.0', link: withBase('/en/docs/chronicles/version-v0.1.0/') },
             ],
           },
           {
@@ -136,7 +136,7 @@ export default defineConfig({
       themeConfig: {
         // https://vitepress.dev/reference/default-theme-config
         nav: [
-          { text: '文档', link: withBase('/zh-Hans/overview/') },
+          { text: '文档', link: withBase('/zh-Hans/docs/overview/') },
           { text: '博客 / 开发日志', link: withBase('/zh-Hans/blog/') },
           {
             text: `v${version}`,
@@ -155,22 +155,22 @@ export default defineConfig({
             text: '概览',
             icon: 'lucide:rocket',
             items: [
-              { text: '介绍', link: withBase('/zh-Hans/overview/') },
-              { text: '有关 AI VTuber', link: withBase('/zh-Hans/overview/about-ai-vtuber') },
-              { text: '有关 Neuro-sama', link: withBase('/zh-Hans/overview/about-neuro-sama') },
+              { text: '介绍', link: withBase('/zh-Hans/docs/overview/') },
+              { text: '有关 AI VTuber', link: withBase('/zh-Hans/docs/overview/about-ai-vtuber') },
+              { text: '有关 Neuro-sama', link: withBase('/zh-Hans/docs/overview/about-neuro-sama') },
             ],
           },
           {
             text: '指南',
             icon: 'lucide:book-open',
             items: [
-              { text: '贡献指南', link: withBase('/zh-Hans/guides/contributing/') },
+              { text: '贡献指南', link: withBase('/zh-Hans/docs/guides/contributing/') },
               {
                 text: '设计指引',
-                link: withBase('/zh-Hans/guides/design-guidelines/'),
+                link: withBase('/zh-Hans/docs/guides/design-guidelines/'),
                 items: [
-                  { text: '参考资源', link: withBase('/zh-Hans/guides/contributing/design-guidelines/resources') },
-                  { text: '工具', link: withBase('/zh-Hans/guides/contributing/design-guidelines/tools') },
+                  { text: '参考资源', link: withBase('/zh-Hans/docs/guides/contributing/design-guidelines/resources') },
+                  { text: '工具', link: withBase('/zh-Hans/docs/guides/contributing/design-guidelines/tools') },
                 ],
               },
             ],
@@ -178,10 +178,10 @@ export default defineConfig({
           {
             text: '编年史',
             icon: 'lucide:calendar-days',
-            link: withBase('/zh-Hans/chronicles/'),
+            link: withBase('/zh-Hans/docs/chronicles/'),
             items: [
-              { text: '先前的故事 v0.0.1', link: withBase('/zh-Hans/chronicles/version-v0.0.1/') },
-              { text: '首次公开 v0.1.0', link: withBase('/zh-Hans/chronicles/version-v0.1.0/') },
+              { text: '先前的故事 v0.0.1', link: withBase('/zh-Hans/docs/chronicles/version-v0.0.1/') },
+              { text: '首次公开 v0.1.0', link: withBase('/zh-Hans/docs/chronicles/version-v0.1.0/') },
             ],
           },
           {

docs/package.json

@@ -16,6 +16,7 @@
     "@proj-airi/i18n": "workspace:^",
     "@vueuse/core": "^12.8.2",
     "motion-v": "^1.5.0",
+    "pathe": "^2.0.3",
     "reka-ui": "^2.3.1",
     "vue": "^3.5.13",
     "vue-i18n": "^11.1.9",