chore: fixes

locales/en.json

@@ -1,10 +1,12 @@
 {
-  "intro": {
-    "whats-your-name": "What's your name?",
-    "hi": "Hi, {name}!"
-  },
   "button": {
-    "go": "GO",
+    "back": "Back",
-    "back": "Back"
+    "go": "GO"
+  },
+  "intro": {
+    "desc": "Opinionated Vite Starter Template",
+    "dynamic-route": "Demo of dynamic route",
+    "hi": "Hi, {name}!",
+    "whats-your-name": "What's your name?"
   }
 }

locales/fr.json

@@ -1,10 +1,12 @@
 {
   "button": {
-    "back": "Arrière",
+    "back": "Retour",
-    "go": "ALLER"
+    "go": "Commencer"
   },
   "intro": {
+    "desc": "Modèle de Vite dogmatique",
+    "dynamic-route": "Démo de dynamic route",
     "hi": "Salut, {name}!",
-    "whats-your-name": "Quel est ton nom?"
+    "whats-your-name": "Comment tu t'appelles?"
   }
 }

locales/zh-CN.json

@@ -4,6 +4,8 @@
     "go": "确定"
   },
   "intro": {
+    "desc": "固执己见的 Vite 项目模板",
+    "dynamic-route": "动态路由演示",
     "hi": "你好，{name}！",
     "whats-your-name": "输入你的名字"
   }

package.json

@@ -11,7 +11,7 @@
     "@vueuse/core": "^4.0.0-beta.4",
     "variantwind": "^0.6.0",
     "vue": "^3.0.0-rc.5",
-    "vue-i18n": "9.0.0-alpha.10",
+    "vue-i18n": "9.0.0-alpha.11",
     "vue-router": "^4.0.0-beta.6"
   },
   "devDependencies": {

pnpm-lock.yaml

@@ -3,7 +3,7 @@ dependencies:
   '@vueuse/core': 4.0.0-beta.4_vue@3.0.0-rc.5
   variantwind: 0.6.0
   vue: 3.0.0-rc.5
-  vue-i18n: 9.0.0-alpha.10_vue@3.0.0-rc.5
+  vue-i18n: 9.0.0-alpha.11_vue@3.0.0-rc.5
   vue-router: 4.0.0-beta.6_vue@3.0.0-rc.5
 devDependencies:
   '@antfu/eslint-config-vue': 0.2.14_eslint@7.6.0+typescript@3.9.7
@@ -3905,19 +3905,20 @@ packages:
       eslint: '>=5.0.0'
     resolution:
       integrity: sha512-Kr21uPfthDc63nDl27AGQEhtt9VrZ9nkYk/NTftJ2ws9XiJwzJJCnCr3AITQ2jpRMA0XPGDECxYH8E027qMK9Q==
-  /vue-i18n/9.0.0-alpha.10_vue@3.0.0-rc.5:
+  /vue-i18n/9.0.0-alpha.11_vue@3.0.0-rc.5:
     dependencies:
       vue: 3.0.0-rc.5
     dev: false
     engines:
       node: '>= 10'
     peerDependencies:
-      vue: ^3.0.0-beta.14
+      vue: ^3.0.0-beta.15
     resolution:
-      integrity: sha512-tkkMo4i+/kWyq7cepB/Eo+JuOaHqtUHZzqbfKmt2KEZFJ1aOJg+bBRfJuGZUupOCgs2zJJX7R6nM58nKEK5Piw==
+      integrity: sha512-Ro+85srXAO/eyG/eb1+WOqqxFln7PEP2uv8XSiBfOH1lRGYXu/h5Ixunr1cOHwLJ5cYc1BSkFWW937brYer/tA==
   /vue-router/4.0.0-beta.6_vue@3.0.0-rc.5:
     dependencies:
       vue: 3.0.0-rc.5
+    dev: false
     peerDependencies:
       vue: ^3.0.0-beta.20
     resolution:
@@ -4055,5 +4056,5 @@ specifiers:
   vite-plugin-purge-icons: ^0.2.1
   vite-plugin-voie: ^0.2.0
   vue: ^3.0.0-rc.5
-  vue-i18n: 9.0.0-alpha.10
+  vue-i18n: 9.0.0-alpha.11
   vue-router: ^4.0.0-beta.6

src/components/Footer.vue

@@ -10,6 +10,16 @@
       />
     </div>
 
+    <div
+      class="icon-btn mx-2"
+      @click="toggleLocales"
+    >
+      <Icon
+        class="inline-block"
+        icon="carbon:language"
+      />
+    </div>
+
     <a
       class="icon-btn mx-2"
       href="https://github.com/antfu/vitesse"
@@ -20,16 +30,6 @@
         icon="carbon:code"
       />
     </a>
-
-    <div
-      class="icon-btn mx-2"
-      @click="toggleLocales"
-    >
-      <Icon
-        class="inline-block"
-        icon="carbon:globe"
-      />
-    </div>
   </div>
 </template>
 

src/components/Icon.vue

@@ -17,6 +17,7 @@ const update = async() => {
     await nextTick()
     const svg = Iconify.renderSVG(props.icon, {})
     if (svg) {
+      el.value.textContent = ''
       el.value.appendChild(svg)
     }
     else {

src/pages/hi/[name].vue

@@ -7,6 +7,9 @@
     <p>
       {{ t('intro.hi', {name}) }}
     </p>
+    <p class="text-sm opacity-50">
+      <em>{{ t('intro.dynamic-route') }}</em>
+    </p>
 
     <div>
       <button

src/pages/index.vue

@@ -5,7 +5,12 @@
       <Icon class="iconify inline-block" icon="carbon:campsite" />
     </p>
     <p>
-      Vitesse
+      <a href="https://github.com/antfu/vitesse" target="_blank">
+        Vitesse
+      </a>
+    </p>
+    <p class="text-sm opacity-50">
+      <em>{{ t('intro.desc') }}</em>
     </p>
 
     <div class="py-4" />
@@ -13,7 +18,8 @@
     <input
       v-model="name"
       :placeholder="t('intro.whats-your-name')"
-      class="px-4 py-2 border border-gray-200 rounded text-center outline-none active:outline-none bg-transparent dark:border-gray-700"
+      class="px-4 py-2 border border-gray-200 rounded text-center text-sm outline-none active:outline-none bg-transparent dark:border-gray-700"
+      style="width: 250px"
       @keydown.enter="go"
     >
 

src/utils/dark.ts

@@ -18,9 +18,6 @@ export const isDark = computed({
 
 watch(
   isDark,
-  (v) => {
+  v => document.documentElement.classList.toggle('schema-dark', v),
-    const html = document.documentElement
-    html.classList.toggle('schema-dark', v)
-  },
   { immediate: true },
 )