fix(web): Schriftzug traegt im dunklen Modus die Markenfarbe
Die vorherige Korrektur war zu grob: sie hat das Gelb ueberall durch die Vordergrundfarbe ersetzt, obwohl es nur im hellen Erscheinungsbild ein Problem war. Nachgerechnet gegen die tatsaechlichen Farbwerte aus globals.css: Gelb auf hellem Grund 1,26 : 1 (Kopfleiste) unlesbar Gelb auf heller Leiste 1,24 : 1 (Seitenleiste) unlesbar Gelb auf dunklem Grund 13,06 : 1 hervorragend Gelb auf dunkler Leiste 14,00 : 1 hervorragend WCAG verlangt 3:1 fuer grossen fetten Text. Das Gelb faellt also nur auf hellem Grund durch — auf dunklem ist es die mit Abstand beste Wahl. Der Schriftzug erbt jetzt im hellen Erscheinungsbild die Vordergrundfarbe (19:1) und traegt im dunklen die Markenfarbe. Umgesetzt ueber wordmarkClassName an den beiden Aufrufstellen, nicht in der Komponente selbst: das gelbe Anmelde-Panel ist themeunabhaengig hell und braucht dort weiterhin dunkle Schrift. Im Browser in beide Richtungen gemessen: hell oklch(0.15 0 0), dunkel oklch(0.91 0.19 102) — letzteres ist exakt --primary. Ausserdem in STATE.md festgehalten, dass Tessera zunaechst nur intern eingesetzt wird und die Abnahme der Mandantentrennung (Plan 02-05, Erfolgskriterium 4) deshalb bewusst zurueckgestellt ist — nicht zurueckgebaut, und vor einem Einsatz bei externen Kunden nachzuholen. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01K5jtbGzC5Sf9npJ3JCjKhq
This commit is contained in:
@@ -89,7 +89,15 @@ export function Header() {
|
||||
<line x1="3" y1="18" x2="21" y2="18" />
|
||||
</svg>
|
||||
</button>
|
||||
<TesseraLogo variant="horizontal" size={28} />
|
||||
<TesseraLogo
|
||||
variant="horizontal"
|
||||
size={28}
|
||||
// Gelb traegt nur auf dunklem Grund: gemessen 13,1:1 im dunklen
|
||||
// Erscheinungsbild gegen 1,26:1 im hellen (WCAG verlangt 3:1 fuer
|
||||
// grossen fetten Text). Im hellen Modus erbt der Schriftzug daher
|
||||
// die Vordergrundfarbe, im dunklen steht die Markenfarbe.
|
||||
wordmarkClassName="dark:text-primary"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Center: Breadcrumb / page title */}
|
||||
|
||||
Reference in New Issue
Block a user