Translate website in espagnol

app/components/AppFooter.vue

@@ -82,6 +82,11 @@ const { t } = useI18n({
     "find": "Retrouvez-moi sur :",
     "email": "Ou envoyez-moi un email :",
     "copyright": "© {date} Arthur Danjou. Tous droits réservés."
+  },
+  "es": {
+    "find": "Encuéntrame en :",
+    "email": "O envíame un mail",
+    "copyright": "2024 Arthur Danjour. Todos los derechos reservados."
   }
 }
 </i18n>

app/components/AppHeader.vue

@@ -10,58 +10,59 @@ const navs = [
     label: {
       en: 'home',
       fr: 'accueil',
-      es: 'inicio'
+      es: 'inicio',
     },
     to: '/',
     icon: 'house-line-duotone',
     shortcut: {
       en: 'H',
       fr: 'A',
-      es: 'I'
-    }
+      es: 'I',
+    },
   },
   {
     label: {
       en: 'uses',
       fr: 'usages',
-      es: 'usos'
+      es: 'usos',
     },
     to: '/uses',
     icon: 'backpack-duotone',
     shortcut: {
       en: 'U',
       fr: 'U',
-      es: 'U'
-    }
+      es: 'U',
+    },
   },
   {
     label: {
       en: 'portfolio',
       fr: 'portfolio',
-      es: 'escritos'
+      es: 'escritos',
     },
     to: '/portfolio',
     icon: 'books-duotone',
     shortcut: {
       en: 'W',
       fr: 'E',
-      es: 'E'
-    }
+      es: 'E',
+    },
   },
   {
     label: {
       en: 'resume',
       fr: 'cv',
-      es: 'currículum'
+      es: 'currículum',
     },
+    icon: 'address-book-duotone',
     to: '/Resume2024.pdf',
     target: '_blank',
     shortcut: {
       en: 'R',
       fr: 'C',
-      es: 'C'
-    }
-  }
+      es: 'C',
+    },
+  },
 ]
 
 async function toggleTheme() {
@@ -98,7 +99,6 @@ async function changeLocale(newLocale?: string) {
   document.body.style.animation = ''
 }
 
-
 const router = useRouter()
 defineShortcuts({
   t: () => toggleTheme(),
@@ -119,7 +119,7 @@ defineShortcuts({
       <UTooltip
         v-for="nav in navs"
         :key="nav.label.en"
-        :text="nav.label[locale]!"
+        :text="nav.label[locale]"
       >
         <UButton
           :icon="`i-ph:${nav.icon}`"

app/components/content/Activity.vue

@@ -130,6 +130,7 @@ const { t } = useI18n({
   </ClientOnly>
 </template>
 
+//todo: translate
 <i18n lang="json">
 {
   "en": {
@@ -155,7 +156,15 @@ const { t } = useI18n({
     "separator": "à"
   },
   "es": {
-
+    "offline": "Ahora mismo estoy desconectado. Vuelve más tarde para ver en lo que estoy trabajando.",
+    "working": "Estoy trabajando en {project}, editando {state}, y utilizando {editor}. He empezado hace {start}, el {format}.",
+    "idling": "Estoy en reposo en mi ordenador con {editor} en segundo plano.",
+    "tooltip": {
+      "online": "Estoy conectado 👋",
+      "offline": "Estoy desconectado 🫥",
+      "idling": "Estoy durmiendo 😴"
+    },
+    "separator": "a"
   }
 }
 </i18n>

app/components/content/CatchPhrase.vue

@@ -27,6 +27,9 @@ const { t } = useI18n({
   },
   "fr": {
     "quote": "Survolez les textes en gras pour en savoir plus sur moi."
-  }
+  },
+  "es": {
+    "quote": "Pase el cursor sobre los textos en negrita para obtener más información sobre mí."
+  },
 }
 </i18n>

app/components/content/Quote.vue

@@ -31,6 +31,9 @@ const { t } = useI18n({
   },
   "fr": {
     "quote": "Bonjour tout le monde ! Merci de visiter mon portfolio. N'hésitez pas à laisser ce que vous avez à dire, comme des suggestions, des appréciations, des questions ou autre chose !"
+  },
+  "es": {
+    "quote": "Hola a todos ! Muchas gracias por visitar mi portfolio. No dudes en dejar cualquier comentario, como sugerencias, apreciaciones. preguntas, o cualquier cosa !"
   }
 }
 </i18n>

app/components/content/Stats.vue

@@ -35,7 +35,7 @@ const formatDate = (date: Date, format: string) => useDateFormat(date, format, {
         />
       </template>
       <template #editors>
-        {{ stats.editors.data.slice(0, 2).map(editor => `${editor.name} (${editor.percent}%)`).join(' and ') }}
+        {{ stats.editors.data.slice(0, 2).map(editor => `${editor.name} (${editor.percent}%)`).join(t('separator')) }}
       </template>
       <template
         v-if="stats.os.data[0]"
@@ -69,6 +69,14 @@ const formatDate = (date: Date, format: string) => useDateFormat(date, format, {
       "date": "C'était il y a si longtemps 🫣",
       "hours": "C'est beaucoup 😮"
     }
+  },
+  "es": {
+    "stats": "Recopilo datos desde hace {time} años, empecé el {date}. He programado durante un total de {hours} horas. Mis mejores editores son {editors}. Mi mejor OS es {os}. Y mis lenguajes favoritos son {languages}.",
+    "separator": " y ",
+    "tooltip": {
+      "date": "hace tato tiempo…🫣",
+      "hours": "es mucho 😮"
+    }
   }
 }
 </i18n>

app/pages/portfolio/[slug].vue

@@ -235,6 +235,28 @@ async function handleLike() {
     },
     "top": "Remonter en haut",
     "back": "Retourner en arrière"
+  },
+  "es": {
+    "likes": {
+      "one": "like",
+      "many": "likes"
+    },
+    "views": {
+      "one": "view",
+      "many": "views"
+    },
+    "alert": {
+      "title": "Cuidado con las traducciones!",
+      "description": " Por problemas de tiempo, los artículos solo están disponibles en inglés. Gracias por vuestra comprensión.ug ñeóicula."
+    },
+    "thanks": "Muchas gracias por leer este postougracoias afic! Si te ha gustado, no dudes en compartirlo con tus amigos.tsaf. {like}",
+    "like": "No te olvides de dejar un like!",
+    "link": {
+      "copied": "Link copiado",
+      "copy": "Copiar link"
+    },
+    "top": "Ir arribaarr",
+    "back": "Volver atrás"
   }
 }
 </i18n>

app/pages/portfolio/index.vue

@@ -26,8 +26,9 @@ const tags: Array<{ label: string, icon: string } & Tag> = [
     label: 'All',
     icon: 'i-ph-books-duotone',
     color: 'black',
+    translation: 'tags.all',
   },
-  ...TAGS.filter(tag => tag.sort).sort((a, b) => a.label.localeCompare(b.label)),
+  ...TAGS.filter(tag => tag.title).sort((a, b) => a.label.localeCompare(b.label)),
 ]
 
 function updateTag(index: number) {
@@ -50,7 +51,11 @@ function updateTag(index: number) {
       icon="i-ph-warning-duotone"
       variant="outline"
     />
-    <UTabs :items="tags" @change="updateTag" />
+    <UTabs :items="tags" @change="updateTag">
+      <template #default="{ item }">
+        <span class="truncate">{{ t(item.translation) }}</span>
+      </template>
+    </UTabs>
     <ul class="grid grid-cols-1 md:grid-cols-2 gap-8">
       <NuxtLink
         v-for="(writing, id) in writings"
@@ -89,7 +94,7 @@ function updateTag(index: number) {
                 :ui="{ rounded: 'rounded-full' }"
               >
                 <div class="flex gap-1 items-center">
-                  <UIcon :name="TAGS.find(icon => icon.label.toLowerCase() === tag)?.icon" size="16" />
+                  <UIcon :name="TAGS.find(icon => icon.label.toLowerCase() === tag)?.icon || ''" size="16" />
                   <p>{{ TAGS.find(color => color.label.toLowerCase() === tag)?.label }}</p>
                 </div>
               </UBadge>
@@ -117,6 +122,36 @@ function updateTag(index: number) {
     "alert": {
       "title": "Attentions aux traductions!",
       "description": "Par soucis de temps, toutes les traductions des articles seront disponibles uniquement en anglais. Merci de votre compréhension."
+    },
+    "tags": {
+      "article": "Articles",
+      "all": "Bibliothèque",
+      "project": "Projets",
+      "r": "R",
+      "python": "Python",
+      "data": "Data",
+      "ai": "AI",
+      "maths": "Maths",
+      "web": "Web"
+    }
+  },
+  "es": {
+    "title": "Escritos sobre mi vida, el desarrollo, mis proyectos y mis pasiones.",
+    "description": " Todas mis reflexiones sobre la programación, las matemáticas, la conception de la inteligencia artificial, etc. están puestas en orden cronológico. También escribo sobre mis proyectos, mis descubrimientos y mis pensamientos.",
+    "alert": {
+      "title": "Cuidado con las traducciones !",
+      "description": "Por problema de tiempo, los artículos están solo disponibles en ingles. Gracias por vuestra comprensión."
+    },
+    "tags": {
+      "article": "Artículos",
+      "all": "Biblioteca",
+      "project": "Proyectos",
+      "r": "R",
+      "python": "Python",
+      "data": "Datos",
+      "ai": "IA",
+      "maths": "Mates",
+      "web": "Web"
     }
   }
 }

app/pages/uses.vue

@@ -72,7 +72,7 @@ const stack = items.value!.filter(item => item.category === 'stack')
 <i18n lang="json">
 {
   "en": {
-    "title": "Uses",
+    "title": "My uses",
     "description": "Software I use, gadgets I love, and other things I recommend. Here’s a big list of all of my favorite stuff.",
     "hardware": "Hardware",
     "software": "Software",
@@ -88,6 +88,15 @@ const stack = items.value!.filter(item => item.category === 'stack')
     "ide": "IDE & Police",
     "stack": "Stack",
     "intellij": "Mon IDE IntelliJ Idea Ultimate"
+  },
+  "es": {
+    "title": "Mis aplicaciones.",
+    "description": "Los programas que utilizo, los gadgets que adoro y otras cosas que recomiendo. Aquí te hago una lista de todas mis cosas preferidas. ",
+    "hardware": "Material",
+    "software": "Programas",
+    "ide": "IDE y Fuente",
+    "stack": "Stack",
+    "intellij": "Mi IDE IntelliJ Idea Ultimate"
   }
 }
 </i18n>