Add a language switcher with English, Italian, Spanish and French

The interface is translated through @nuxtjs/i18n: strings live in
i18n/locales/*.json, routes are prefixed except for the default English, and
useLocaleHead emits the lang attribute, the hreflang alternates and og:locale.

The switcher is a native select rather than a custom dropdown: keyboard
support, the platform picker on mobile and correct labelling come for free.

Article content stays single-language — this translates the site chrome only.
This commit is contained in:
2026-08-25 14:23:09 +02:00
parent f5639111f9
commit c08f53ca69
21 changed files with 3197 additions and 87 deletions
+4 -7
View File
@@ -5,23 +5,20 @@ const props = defineProps<{ error: NuxtError }>()
const isNotFound = computed(() => props.error.statusCode === 404)
useHead(useLocaleHead())
useSeoMeta({ robots: 'noindex' })
</script>
<template>
<NuxtLayout>
<h1>{{ isNotFound ? 'Page not found' : 'Something went wrong' }}</h1>
<h1>{{ isNotFound ? $t('error.notFoundTitle') : $t('error.genericTitle') }}</h1>
<p class="muted">
{{
isNotFound
? 'The page you are looking for does not exist or has moved.'
: 'Please try again in a moment.'
}}
{{ isNotFound ? $t('error.notFoundBody') : $t('error.genericBody') }}
</p>
<p>
<NuxtLink to="/">Back to home</NuxtLink>
<NuxtLinkLocale to="/">{{ $t('error.backHome') }}</NuxtLinkLocale>
</p>
</NuxtLayout>
</template>