search

GouvernementFR / dsfr

🇫🇷 Official french government's design system (Système de Design de l'État)
https://www.systeme-de-design.gouv.fr/
Other
233 stars 52 forks source link

Clignotement au chargement de la page lorsque le dark mode est sélectionné #960

Closed Thommusa closed 2 months ago

Thommusa commented 2 months ago

Décrire le bug

Lorsqu'on utilise le composant "Paramètre d'affichage" et que l'on se met en dark mod, un clignotement blanc au chargement de la page est perceptible. Le bug peut être observé sur votre propre site : https://www.systeme-de-design.gouv.fr Le bug n'est pas présent sur les sites que vous cité en exemple : https://www.defense.gouv.fr

Les étapes pour reproduire le bug

Exemple :

  1. Inclure la librairie DSFR
  2. Utiliser le composant "Paramètre d'affichage"
  3. Passer en mode dark theme
  4. Recharger la page
  5. Observer le clignotement en blanc puis noir de la page (se mettre en débit réduit du navigateur pour mieux observer)

Configuration et système utilisé

keryanS commented 2 months ago

Bonjour, Il existe un script à ajouter au début du contenu qui permet d'éviter ce clignotement : https://main--ds-gouv.netlify.app/example/scheme/ Keryan Sanié, pour l'équipe DSFR.

Thommusa commented 2 months ago

bonjour, merci pour la réponse. Juste pour savoir pourquoi ces lignes ne sont pas inclues directement dans la librairie ?