Commutateur de mode sombre/clair

Votre question concerne-t-elle ce composant de thème qui ajoute un interrupteur pour passer en mode sombre, ou la détection d’une palette de couleurs sombres en général ?

Il y a dark-light-choose.

2 « J'aime »

Merci pour votre aide.
J’utilise ce composant de basculement jour/nuit.

Ma question porte sur la détection du mode dans lequel je me trouve et sur le changement de l’image d’arrière-plan afin de pouvoir avoir une image pour le mode clair et une autre pour le mode sombre.

J’ai essayé de suivre le lien que vous avez posté et aussi celui-ci

qui donne un peu plus de détails, mais je n’ai pas réussi. J’ai essayé d’ajouter des fichiers image (JPG) $bg-light et $bg-dark à mon thème


J’ai également essayé d’ajouter une feuille de style color_definitions.scss à mon thème avec le code de ce post

$bg: url(dark-light-choose($bg-light, $bg-dark));

:root {
  --custom-bg: #{$bg};
}

J’ai également essayé de créer un thème sur github

Comme je l’ai dit, désolé d’être un peu perdu.
Si je dois ouvrir un nouveau sujet, faites-le moi savoir et dans quelle catégorie le placer.
Merci pour votre aide.

1 « J'aime »

Les modérateurs peuvent déplacer les messages vers un nouveau sujet dans Dev si nécessaire. Je voulais juste m’assurer que votre problème n’est pas directement lié au composant du thème, mais qu’il se produit également lorsque vous activez le mode sombre via les paramètres du navigateur ou de l’appareil.

Je pense que vous êtes déjà très proche. Une chose que j’ai remarquée est que vous utilisez url() deux fois :

1 « J'aime »

Mon problème n’est absolument pas lié au composant de thème
Merci pour votre aide, désolé pour le bruit :blush:

Ouah… ne le dites à personne, c’est ma sauce secrète pour mélanger deux arrière-plans. Le premier a la priorité sur le suivant. Donc, le premier est un dégradé linéaire avec la moitié transparente et l’autre est une image statique :wink: :sunglasses:

Voici l’effet en action

J’ai compris que vous utilisez 2 arrière-plans.

background-image: linear-gradient(to top, white, 15%, transparent), url(var(--custom-bg));

Mais url(var(--custom-bg)) en combinaison avec --custom-bg: #{$bg}; et $bg: url(dark-light-choose($bg-light, $bg-dark)); n’est-ce pas quelque chose comme url(url(dark-light-choose($bg-light, $bg-dark))) ?

3 « J'aime »

Nous proposons désormais un sélecteur de mode sombre/clair dans le cœur de Discourse et avons par conséquent déprécié ce composant de thème. Veuillez consulter l’annonce pour plus de détails :

5 « J'aime »