fix(nav): replace hardcoded ThemeToggle title with Paraglide i18n keys
Some checks failed
CI / Unit & Component Tests (push) Failing after 3m13s
CI / OCR Service Tests (push) Successful in 39s
CI / Backend Unit Tests (push) Failing after 3m13s
CI / Unit & Component Tests (pull_request) Failing after 2m59s
CI / OCR Service Tests (pull_request) Successful in 33s
CI / Backend Unit Tests (pull_request) Failing after 2m56s

Add theme_toggle_to_light / theme_toggle_to_dark to de/en/es messages.
Extract themeLabel as $derived and use it for both aria-label and title,
matching the pattern applied to NotificationBell.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-26 20:53:10 +02:00
parent bc805cb178
commit c317c085aa
4 changed files with 13 additions and 2 deletions

View File

@@ -23,6 +23,8 @@
"nav_conversations": "Briefwechsel", "nav_conversations": "Briefwechsel",
"nav_admin": "Admin", "nav_admin": "Admin",
"nav_logout": "Abmelden", "nav_logout": "Abmelden",
"theme_toggle_to_light": "Zu hellem Design wechseln",
"theme_toggle_to_dark": "Zu dunklem Design wechseln",
"btn_save": "Speichern", "btn_save": "Speichern",
"btn_cancel": "Abbrechen", "btn_cancel": "Abbrechen",
"btn_confirm": "Bestätigen", "btn_confirm": "Bestätigen",

View File

@@ -23,6 +23,8 @@
"nav_conversations": "Letters", "nav_conversations": "Letters",
"nav_admin": "Admin", "nav_admin": "Admin",
"nav_logout": "Sign out", "nav_logout": "Sign out",
"theme_toggle_to_light": "Switch to light mode",
"theme_toggle_to_dark": "Switch to dark mode",
"btn_save": "Save", "btn_save": "Save",
"btn_cancel": "Cancel", "btn_cancel": "Cancel",
"btn_confirm": "Confirm", "btn_confirm": "Confirm",

View File

@@ -23,6 +23,8 @@
"nav_conversations": "Cartas", "nav_conversations": "Cartas",
"nav_admin": "Admin", "nav_admin": "Admin",
"nav_logout": "Cerrar sesión", "nav_logout": "Cerrar sesión",
"theme_toggle_to_light": "Cambiar a modo claro",
"theme_toggle_to_dark": "Cambiar a modo oscuro",
"btn_save": "Guardar", "btn_save": "Guardar",
"btn_cancel": "Cancelar", "btn_cancel": "Cancelar",
"btn_confirm": "Confirmar", "btn_confirm": "Confirmar",

View File

@@ -1,5 +1,6 @@
<script lang="ts"> <script lang="ts">
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { m } from '$lib/paraglide/messages.js';
type Theme = 'light' | 'dark'; type Theme = 'light' | 'dark';
@@ -19,6 +20,10 @@ onMount(() => {
theme = resolveInitialTheme(); theme = resolveInitialTheme();
}); });
const themeLabel = $derived(
theme === 'dark' ? m.theme_toggle_to_light() : m.theme_toggle_to_dark()
);
function toggle() { function toggle() {
theme = theme === 'dark' ? 'light' : 'dark'; theme = theme === 'dark' ? 'light' : 'dark';
localStorage.setItem('theme', theme); localStorage.setItem('theme', theme);
@@ -29,8 +34,8 @@ function toggle() {
<button <button
type="button" type="button"
onclick={toggle} onclick={toggle}
aria-label={theme === 'dark' ? 'light mode' : 'dark mode'} aria-label={themeLabel}
title={theme === 'dark' ? 'light mode' : 'dark mode'} title={themeLabel}
class="rounded p-1.5 text-white/65 transition-colors hover:bg-white/10 hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring" class="rounded p-1.5 text-white/65 transition-colors hover:bg-white/10 hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
> >
{#if theme === 'dark'} {#if theme === 'dark'}