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.
25 lines
590 B
Vue
25 lines
590 B
Vue
<script setup lang="ts">
|
|
import type { NuxtError } from '#app'
|
|
|
|
const props = defineProps<{ error: NuxtError }>()
|
|
|
|
const isNotFound = computed(() => props.error.statusCode === 404)
|
|
|
|
useHead(useLocaleHead())
|
|
useSeoMeta({ robots: 'noindex' })
|
|
</script>
|
|
|
|
<template>
|
|
<NuxtLayout>
|
|
<h1>{{ isNotFound ? $t('error.notFoundTitle') : $t('error.genericTitle') }}</h1>
|
|
|
|
<p class="muted">
|
|
{{ isNotFound ? $t('error.notFoundBody') : $t('error.genericBody') }}
|
|
</p>
|
|
|
|
<p>
|
|
<NuxtLinkLocale to="/">{{ $t('error.backHome') }}</NuxtLinkLocale>
|
|
</p>
|
|
</NuxtLayout>
|
|
</template>
|