Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

Site dark mode: IMPORTANT callouts render as light text on a white box

Ouverte Adaptée aux débutants
  • Quelque chose ne va pas ?
#202 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

Personne n'a encore pris cette issue.

Évaluation

Difficulté
2/5
Temps estimé
1-3 heures
Accessibilité débutants
88/100
Type d'issue
Bug
Clarté
Clairement spécifiée
Activité
Active
Stack technique
css
Domaine
frontend

Piste de recherche

Commencez par src/site/resources/css/site.css et comparez ses variables de couleur alternatives avec la règle pour les callouts IMPORTANT en mode sombre présentée dans l’issue. Ajoutez la surcharge ciblée body.dark .callout.callout-important décrite là, puis vérifiez que les callouts IMPORTANT ont des couleurs de texte et d’arrière-plan lisibles en mode sombre.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

bug documentation

Where: src/site/resources/css/site.css (MetricsHub colors), with Sentry Maven Skin 8.

What happens: in dark mode, an > [!IMPORTANT] callout renders as a white box with light text, which is unreadable.

The skin styles IMPORTANT callouts with the alternate colors, and swaps them in dark mode (published css/main-combined.css):

.callout.callout-important { --callout-bg: var(--alternate-bgcolor); --callout-fg: var(--alternate-fgcolor); }
body.dark .callout.callout-important { --callout-bg: var(--alternate-fgcolor); --callout-fg: var(--alternate-bgcolor); }

Our site.css sets --alternate-bgcolor: #266fd0 and --alternate-fgcolor: #fff and does not override them in body.dark, so in dark mode the callout background becomes #fff. The callout's body text keeps the dark-mode foreground (#e9ecef), so it is light text on white.

Impact today: none of the current pages uses an IMPORTANT callout, so the bug is latent. It shows up as soon as a page adds one. It was found in ipmi-java, which copied this site.css (MetricsHub/ipmi-java#113).

Suggested fix: the fix applied in ipmi-java, appended to site.css:

/* The skin inverts the alternate colors for IMPORTANT callouts in dark mode, which turns our white-on-blue
   palette into a white box with light text */
body.dark .callout.callout-important {
	--callout-bg: var(--main-bgcolor);
	--callout-fg: var(--link-color);
}

Overriding --alternate-fgcolor in body.dark instead would also darken the text that the skin draws on the blue alternate background (active menu item, ...), so the targeted rule is safer. The other MetricsHub projects that share this site.css probably have the same latent bug. The skin's dark rule could arguably handle a light --alternate-fgcolor itself.

Langage dominant
Java
Étoiles
13
Forks
4
Merge moyen
1 j 9 h
PR mergées (30 j)
15

Préparer son environnement

Ce projet ne fournit ni conteneur de développement, ni Dockerfile, ni guide de contribution : l'installation est à votre charge. Commencez par son README, et consultez notre guide de la première contribution pour les étapes générales.

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de MetricsHub/winrm-java

Toutes les issues de MetricsHub/winrm-java

Issues similaires

Plus d'issues Java

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.