Icons in den Verwendungsregeln werden zu hell und inkonsistent gerendert

Zusammenfassung

Die Icons in den Verwendungsregeln sind sehr hell dargestellt und dadurch schwer erkennbar. Zusätzlich tritt das Verhalten nicht bei jedem Laden gleich auf.

Verwendetes KERN Kit

Design-/Web-Komponenten (Link- und Icon-Komponente)
Verwendete Komponente: https://www.kern-ux.de/komponenten/icon

Verwendete Kit-Version

2.4.0

Schritte zur Reproduktion

1. Die Seite „Verwendungsregeln“ der Link-Komponente öffnen: https://www.kern-ux.de/komponenten/link#verwendungsregeln
2. Seite frisch laden
3. Nach unten scrollen
4. Beobachten, dass die Icon-Darstellung beim ersten Laden teils anders ist als nach dem Scrollen

Beispiel

Nicht erforderlich – das Problem tritt direkt auf der Dokumentationsseite auf.

Aktuelles Fehlverhalten

• Die Icons der Verwendungsregeln sind sehr hell dargestellt.
• Das Verhalten scheint nicht stabil: Beim ersten Laden erscheinen die Icons hell/fehlerhaft, beim Scrollen oder erneuten Rendern verschwinden die Effekte teilweise.
• Die Browser-Konsole zeigt außerdem Hinweise auf ein „Docusaurus React Root“-Problem (unbekannt, ob ursächlich).

Erwartetes korrektes Verhalten

Icons sollten stabil und mit ausreichendem Kontrast gerendert werden – sowohl beim initialen Laden als auch beim Scrollen bzw. Re-Rendern.

Relevante Logs und/oder Screenshots

Betroffene Browser

(Running on macOS 26.1 (25B78))

• ❌ Safari latest: Version 26.1 (21622.2.11.11.9)
• ❌ Firefox latest: 145.0.1 (aarch64)
• ❌ Arc Version 1.122.0 (71105), Chromium Engine Version: 142.0.7444.176

Mögliche Lösungen

• Überprüfung der Icon-Farbwerte / Kontrastwerte
• Prüfen, ob ein Re-Render-Problem in Docusaurus/React die initiale Darstellung beeinflusst
• Konsistentes Rendering der Icons sicherstellen (ggf. CSS oder React-Hydration prüfen)