fix(theme): add lang and dir attributes to language picker

Author: brc-dd

docs/.vitepress/config.ts

@@ -124,13 +124,13 @@ export default defineConfig({
   },
 
   locales: {
-    root: { label: 'English' },
-    zh: { label: '简体中文' },
-    pt: { label: 'Português' },
-    ru: { label: 'Русский' },
-    es: { label: 'Español' },
-    ko: { label: '한국어' },
-    fa: { label: 'فارسی' }
+    root: { label: 'English', lang: 'en-US', dir: 'ltr' },
+    zh: { label: '简体中文', lang: 'zh-Hans', dir: 'ltr' },
+    pt: { label: 'Português', lang: 'pt-BR', dir: 'ltr' },
+    ru: { label: 'Русский', lang: 'ru-RU', dir: 'ltr' },
+    es: { label: 'Español', lang: 'es-CO', dir: 'ltr' },
+    ko: { label: '한국어', lang: 'ko-KR', dir: 'ltr' },
+    fa: { label: 'فارسی', lang: 'fa-IR', dir: 'rtl' }
   },
 
   vite: {

docs/es/config.ts

@@ -5,7 +5,6 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'es-CO',
   description: 'Generador de Sitios Estáticos desarrollado con Vite y Vue.',
 
   themeConfig: {

docs/fa/config.ts

@@ -5,9 +5,7 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'fa-IR',
   description: 'ژنراتور استاتیک وب‌سایت با Vite و Vue',
-  dir: 'rtl',
 
   // prettier-ignore
   head: [

docs/ko/config.ts

@@ -5,7 +5,6 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'ko-KR',
   description: 'Vite 및 Vue 기반 정적 사이트 생성기.',
 
   themeConfig: {

docs/pt/config.ts

@@ -5,7 +5,6 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'pt-BR',
   description: 'Gerador de Site Estático desenvolvido com Vite e Vue.',
 
   themeConfig: {

docs/ru/config.ts

@@ -5,7 +5,6 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'ru-RU',
   description: 'Генератор статических сайтов на основе Vite и Vue.',
 
   themeConfig: {

docs/zh/config.ts

@@ -5,7 +5,6 @@ const require = createRequire(import.meta.url)
 const pkg = require('vitepress/package.json')
 
 export default defineAdditionalConfig({
-  lang: 'zh-Hans',
   description: '由 Vite 和 Vue 驱动的静态站点生成器',
 
   themeConfig: {

src/client/theme-default/components/VPMenuLink.vue

@@ -9,11 +9,14 @@ defineProps<{
 }>()
 
 const { page } = useData()
+
+defineOptions({ inheritAttrs: false })
 </script>
 
 <template>
   <div class="VPMenuLink">
     <VPLink
+      v-bind="$attrs"
       :class="{
         active: isActive(
           page.relativePath,
@@ -46,6 +49,7 @@ const { page } = useData()
   font-size: 14px;
   font-weight: 500;
   color: var(--vp-c-text-1);
+  text-align: left;
   white-space: nowrap;
   transition:
     background-color 0.25s,

src/client/theme-default/components/VPNavBarExtra.vue

@@ -31,7 +31,7 @@ const hasExtraContent = computed(
       <p class="trans-title">{{ currentLang.label }}</p>
 
       <template v-for="locale in localeLinks" :key="locale.link">
-        <VPMenuLink :item="locale" />
+        <VPMenuLink :item="locale" :lang="locale.lang" :dir="locale.dir" />
       </template>
     </div>
 

src/client/theme-default/components/VPNavBarTranslations.vue

@@ -19,7 +19,7 @@ const { localeLinks, currentLang } = useLangs({ correspondingLink: true })
       <p class="title">{{ currentLang.label }}</p>
 
       <template v-for="locale in localeLinks" :key="locale.link">
-        <VPMenuLink :item="locale" />
+        <VPMenuLink :item="locale" :lang="locale.lang" :dir="locale.dir" />
       </template>
     </div>
   </VPFlyout>