i18n implemented

app/components/SiteHeader.vue

@@ -44,7 +44,7 @@ async function onLogout() {
       <Button variant="ghost" as-child>
         <NuxtLink to="/users" class="flex items-center gap-1.5">
           <Icon name="ph:users-fill" class="size-4" />
-          Benutzer
+          {{ $t('nav.users') }}
         </NuxtLink>
       </Button>
       <Button v-if="can('admin.access')" variant="ghost" as-child>
@@ -56,12 +56,12 @@ async function onLogout() {
       <button
         type="button"
         class="ml-auto flex h-9 cursor-pointer items-center gap-2 rounded-md border bg-muted/40 px-3 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground"
-        aria-label="Schnellsuche öffnen (Strg+K)"
+        :aria-label="$t('nav.searchAria')"
         @click="paletteOpen = true"
       >
         <Icon name="ph:magnifying-glass-fill" class="size-4" />
-        <span class="hidden text-left sm:inline">Suchen…</span>
-        <kbd class="hidden rounded-sm border bg-background px-1.5 text-xs sm:inline">Strg K</kbd>
+        <span class="hidden text-left sm:inline">{{ $t('nav.search') }}</span>
+        <kbd class="hidden rounded-sm border bg-background px-1.5 text-xs sm:inline">{{ $t('nav.searchShortcut') }}</kbd>
       </button>
       <div class="flex items-center gap-3">
         <Tooltip>
@@ -75,7 +75,7 @@ async function onLogout() {
               <Icon name="ph:squares-four-fill" v-else class="size-5" />
             </Button>
           </TooltipTrigger>
-          <TooltipContent>{{ uniform ? 'Bento-Layout' : 'Einheitliche Größe' }}</TooltipContent>
+          <TooltipContent>{{ uniform ? $t('nav.gridBento') : $t('nav.gridUniform') }}</TooltipContent>
         </Tooltip>
         <ThemeSelector />
         <template v-if="user">
@@ -104,29 +104,29 @@ async function onLogout() {
               <DropdownMenuItem as-child>
                 <NuxtLink :to="`/user/${user.id}`" class="flex items-center gap-2">
                   <Icon name="ph:user-fill" class="size-4" />
-                  Profil
+                  {{ $t('nav.profile') }}
                 </NuxtLink>
               </DropdownMenuItem>
               <DropdownMenuItem as-child>
                 <NuxtLink to="/settings" class="flex items-center gap-2">
                   <Icon name="ph:gear-fill" class="size-4" />
-                  Einstellungen
+                  {{ $t('nav.settings') }}
                 </NuxtLink>
               </DropdownMenuItem>
               <DropdownMenuSeparator />
               <DropdownMenuItem variant="destructive" class="flex items-center gap-2" @click="onLogout">
                 <Icon name="ph:sign-out-fill" class="size-4" />
-                Ausloggen
+                {{ $t('auth.logout') }}
               </DropdownMenuItem>
             </DropdownMenuContent>
           </DropdownMenu>
         </template>
         <template v-else>
           <Button variant="ghost" as-child>
-            <NuxtLink to="/login">Login</NuxtLink>
+            <NuxtLink to="/login">{{ $t('auth.login') }}</NuxtLink>
           </Button>
           <Button as-child>
-            <NuxtLink to="/register">Registrieren</NuxtLink>
+            <NuxtLink to="/register">{{ $t('auth.register') }}</NuxtLink>
           </Button>
         </template>
       </div>