feat(localization): expand language support and enhance UI for user settings

- Added support for additional UI locales including Cebuano and Spanish, improving accessibility for a broader user base.
- Updated language selection components in the AppHeader and SettingsWidget to reflect new language options, enhancing user experience.
- Enhanced localization of various UI elements across components, ensuring consistent language representation and improved user engagement.
- Implemented logic to synchronize user language preferences with backend settings, providing a seamless experience when changing languages.
This commit is contained in:
Torsten Schulz (local)
2026-04-02 07:54:44 +02:00
parent 6e1fe6f3a8
commit c50a6b3c35
72 changed files with 1792 additions and 343 deletions

View File

@@ -2,7 +2,7 @@
<div class="vocab-view">
<section class="vocab-hero surface-card">
<div>
<span class="vocab-kicker">Sprachenlernen</span>
<span class="vocab-kicker">{{ $t('socialnetwork.vocab.heroEyebrow') }}</span>
<h2>{{ $t('socialnetwork.vocab.title') }}</h2>
<p>{{ $t('socialnetwork.vocab.description') }}</p>
</div>
@@ -14,33 +14,33 @@
<section class="vocab-summary-grid">
<article class="summary-card surface-card">
<span class="summary-card__label">Sprachen gesamt</span>
<span class="summary-card__label">{{ $t('socialnetwork.vocab.summaryTotalLabel') }}</span>
<strong>{{ languages.length }}</strong>
<p>Alle aktiven Sprachbereiche, in denen du Inhalte nutzt oder verwaltest.</p>
<p>{{ $t('socialnetwork.vocab.summaryTotalIntro') }}</p>
</article>
<article class="summary-card surface-card">
<span class="summary-card__label">Eigene Bereiche</span>
<span class="summary-card__label">{{ $t('socialnetwork.vocab.summaryOwnedLabel') }}</span>
<strong>{{ ownedLanguages.length }}</strong>
<p>Hier legst du Inhalte, Kapitel und Lernmaterial aktiv selbst an.</p>
<p>{{ $t('socialnetwork.vocab.summaryOwnedIntro') }}</p>
</article>
<article class="summary-card surface-card">
<span class="summary-card__label">Abonniert</span>
<span class="summary-card__label">{{ $t('socialnetwork.vocab.summarySubscribedLabel') }}</span>
<strong>{{ subscribedLanguages.length }}</strong>
<p>Diese Bereiche sind eher für Lernen und Fortschritt statt Verwaltung gedacht.</p>
<p>{{ $t('socialnetwork.vocab.summarySubscribedIntro') }}</p>
</article>
</section>
<section class="vocab-task-grid">
<article class="task-card surface-card">
<span class="task-card__eyebrow">Schnellstart</span>
<h3>Neue Sprache anlegen</h3>
<p>Der beste Einstieg, wenn du Inhalte selbst strukturieren und pflegen willst.</p>
<span class="task-card__eyebrow">{{ $t('socialnetwork.vocab.taskCreateEyebrow') }}</span>
<h3>{{ $t('socialnetwork.vocab.taskCreateTitle') }}</h3>
<p>{{ $t('socialnetwork.vocab.taskCreateIntro') }}</p>
<button type="button" @click="goNewLanguage">{{ $t('socialnetwork.vocab.newLanguage') }}</button>
</article>
<article class="task-card surface-card">
<span class="task-card__eyebrow">Weiterlernen</span>
<h3>Kurse und Kapitel öffnen</h3>
<p>Springe direkt in bestehende Lernpfade und arbeite mit vorhandenen Kursen weiter.</p>
<span class="task-card__eyebrow">{{ $t('socialnetwork.vocab.taskContinueEyebrow') }}</span>
<h3>{{ $t('socialnetwork.vocab.taskContinueTitle') }}</h3>
<p>{{ $t('socialnetwork.vocab.taskContinueIntro') }}</p>
<button type="button" class="button-secondary" @click="goCourses">{{ $t('socialnetwork.vocab.courses.title') }}</button>
</article>
</section>
@@ -54,8 +54,8 @@
<section class="language-section">
<div class="language-section__header">
<div>
<h3>Eigene Sprachen</h3>
<p>Direkter Einstieg in Bearbeitung, Kapitel und Kursverwaltung.</p>
<h3>{{ $t('socialnetwork.vocab.ownedSectionTitle') }}</h3>
<p>{{ $t('socialnetwork.vocab.ownedSectionIntro') }}</p>
</div>
<span class="language-section__count">{{ ownedLanguages.length }}</span>
</div>
@@ -64,20 +64,20 @@
<button type="button" class="language-card__main" @click="openLanguage(l.id)">
<div class="language-card__info">
<span class="langname">{{ l.name }}</span>
<span class="language-card__hint">Verwalten und Inhalte pflegen</span>
<span class="language-card__hint">{{ $t('socialnetwork.vocab.ownedHint') }}</span>
</div>
<span class="role">{{ $t('socialnetwork.vocab.owner') }}</span>
</button>
</li>
</ul>
<p v-else class="language-empty">Noch keine eigenen Sprachbereiche vorhanden.</p>
<p v-else class="language-empty">{{ $t('socialnetwork.vocab.ownedEmpty') }}</p>
</section>
<section class="language-section">
<div class="language-section__header">
<div>
<h3>Abonnierte Sprachen</h3>
<p>Gut für schnellen Wiedereinstieg ins Lernen ohne Verwaltungsaufwand.</p>
<h3>{{ $t('socialnetwork.vocab.subscribedSectionTitle') }}</h3>
<p>{{ $t('socialnetwork.vocab.subscribedSectionIntro') }}</p>
</div>
<span class="language-section__count">{{ subscribedLanguages.length }}</span>
</div>
@@ -86,13 +86,13 @@
<button type="button" class="language-card__main" @click="openLanguage(l.id)">
<div class="language-card__info">
<span class="langname">{{ l.name }}</span>
<span class="language-card__hint">Lernen, üben und Fortschritt ansehen</span>
<span class="language-card__hint">{{ $t('socialnetwork.vocab.subscribedHint') }}</span>
</div>
<span class="role">{{ $t('socialnetwork.vocab.subscribed') }}</span>
</button>
</li>
</ul>
<p v-else class="language-empty">Keine abonnierten Sprachen vorhanden.</p>
<p v-else class="language-empty">{{ $t('socialnetwork.vocab.subscribedEmpty') }}</p>
</section>
</div>
</section>