Fix dark mode on synthesis panel and static pages

- Synthesis column: bg-[#F9F7F1] → dark:bg-card; noise overlay
  mix-blend-multiply → dark:mix-blend-overlay (avoids darkening an
  already dark background)
- Mobile tab button active synthesis state: same bg fix
- Submission alert (error): add dark:bg-amber-950/40 dark:text-amber-200
  dark:border-amber-800/50
- not-found.tsx: bg-gray-50 → dark:bg-background; text colors use
  semantic tokens (text-foreground, text-muted-foreground)
- flyer.tsx: control bar bg-white → dark:bg-card; printable flyer
  stays white intentionally

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-23 17:30:10 +02:00
parent 2ab561f61e
commit 219292ea6c
3 changed files with 8 additions and 8 deletions
+4 -4
View File
@@ -331,7 +331,7 @@ export default function Home() {
Proposer
</button>
<button
className={`flex-1 py-3 transition-colors flex items-center justify-center gap-1.5 ${mobileTab === "synthese" ? "border-b-2 border-primary text-primary bg-[#F9F7F1] font-bold" : "text-muted-foreground bg-background"}`}
className={`flex-1 py-3 transition-colors flex items-center justify-center gap-1.5 ${mobileTab === "synthese" ? "border-b-2 border-primary text-primary bg-[#F9F7F1] dark:bg-card font-bold" : "text-muted-foreground bg-background"}`}
onClick={() => setMobileTab("synthese")}
>
Synthèse <span className="font-mono opacity-60">{countdown}s</span>
@@ -436,7 +436,7 @@ export default function Home() {
{submitResult && (
<Alert
variant={submitResult.success ? "default" : "default"}
className={`mt-2 ${submitResult.success ? "" : "border-amber-300 bg-amber-50 text-amber-900"}`}
className={`mt-2 ${submitResult.success ? "" : "border-amber-300 bg-amber-50 text-amber-900 dark:border-amber-800/50 dark:bg-amber-950/40 dark:text-amber-200"}`}
data-testid={`alert-submit-${submitResult.success ? "success" : "info"}`}
>
{submitResult.success
@@ -555,9 +555,9 @@ export default function Home() {
</div>
{/* Colonne droite : synthèse vivante */}
<div className={`flex flex-col bg-[#F9F7F1] relative overflow-hidden md:flex ${mobileTab === "synthese" ? "" : "hidden"}`}>
<div className={`flex flex-col bg-[#F9F7F1] dark:bg-card relative overflow-hidden md:flex ${mobileTab === "synthese" ? "" : "hidden"}`}>
<div
className="absolute inset-0 opacity-[0.03] pointer-events-none mix-blend-multiply"
className="absolute inset-0 opacity-[0.03] pointer-events-none mix-blend-multiply dark:mix-blend-overlay"
style={{
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")`,
}}