feat(watch): bouton cinema visible uniquement au survol du lecteur

This commit is contained in:
2026-09-26 14:27:29 -04:00
parent 80afa9b0d0
commit db03b70854
+3 -2
View File
@@ -5,11 +5,12 @@
<div class="min-w-0">
<!-- Lecteur : monté dès que l'URL d'embed est calculable (route),
sans attendre /details, suggestions ou historique. -->
<section aria-label="Lecteur vidéo" class="relative overflow-hidden rounded-2xl bg-black shadow-2xl ring-1 ring-white/10">
<section aria-label="Lecteur vidéo" class="group relative overflow-hidden rounded-2xl bg-black shadow-2xl ring-1 ring-white/10">
<button (click)="toggleCinema()" [attr.aria-pressed]="cinemaMode()"
[title]="cinemaMode() ? 'Quitter le mode cinéma (Échap)' : 'Mode cinéma : élargir la vidéo (T)'"
[attr.aria-label]="cinemaMode() ? 'Quitter le mode cinéma' : 'Activer le mode cinéma'"
class="absolute right-3 top-12 z-10 inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-semibold shadow-lg transition focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400"
class="absolute right-3 top-12 z-10 inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-semibold shadow-lg transition-opacity focus-visible:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400"
[class.opacity-0]="!cinemaMode()" [class.group-hover:opacity-100]="!cinemaMode()" [class.group-focus-within:opacity-100]="!cinemaMode()"
[class.bg-red-600]="cinemaMode()" [class.text-white]="cinemaMode()"
[class.bg-black/70]="!cinemaMode()" [class.text-slate-200]="!cinemaMode()" [class.hover:bg-black/90]="!cinemaMode()">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">