feat(themes): interrupteur global bande des themes + masquee sur watch
CI / build-and-test (push) Failing after 8m18s
CI / build-and-test (push) Failing after 8m18s
- ThemesService: signal barVisible persiste (localStorage), toggle global - header: bouton oeil afficher/masquer la bande (aria-pressed, FR/EN) - app: affichage = page autorisee ET interrupteur; allowlist stricte (accueil + /t/... uniquement, chemin normalise) -> jamais sur /watch - i18n: cles themes.showBar/hideBar FR/EN
This commit is contained in:
@@ -21,6 +21,17 @@
|
||||
|
||||
<!-- Right: user -->
|
||||
<div class="justify-self-end flex items-center gap-3 pr-3 md:pr-4">
|
||||
<!-- Toggle global de la bande des thèmes -->
|
||||
<button (click)="toggleThemesBar()"
|
||||
[attr.aria-pressed]="themesBarVisible()"
|
||||
[attr.title]="themesBarVisible() ? ('themes.hideBar' | t : 'Masquer la bande des thèmes') : ('themes.showBar' | t : 'Afficher la bande des thèmes')"
|
||||
aria-label="Afficher ou masquer la bande des thèmes"
|
||||
class="p-2 rounded-full text-slate-200 hover:bg-slate-700 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400"
|
||||
[class.opacity-40]="!themesBarVisible()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
||||
<path d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17a5 5 0 1 1 0-10 5 5 0 0 1 0 10zm0-8a3 3 0 1 0 0 6 3 3 0 0 0 0-6z"/>
|
||||
</svg>
|
||||
</button>
|
||||
<!-- Provider context indicator placed between search and user area -->
|
||||
<div *ngIf="providerContextLabel()" class="flex items-center gap-1 text-xs">
|
||||
<span class="inline-flex items-center px-2 py-0.5 rounded border shadow-sm gap-1"
|
||||
|
||||
@@ -178,6 +178,12 @@ export class HeaderComponent {
|
||||
return p?.label || ctx;
|
||||
});
|
||||
|
||||
// Bande des thèmes : interrupteur global (persisté dans ThemesService)
|
||||
themesBarVisible = this.themes.barVisible;
|
||||
toggleThemesBar(): void {
|
||||
this.themes.toggleBarVisible();
|
||||
}
|
||||
|
||||
// Theme management (global/local)
|
||||
themeOptions = ['system', 'light', 'dark', 'black', 'blue'];
|
||||
currentTheme = signal<string>((() => {
|
||||
|
||||
Reference in New Issue
Block a user