Changer des images selon le thème

[Yunie16]

Détails techniques

Version du forum : ModernBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonsoir !

Vu l'installation du thème sombre sur notre forum-test, avec ma collègue graphiste on souhaiterait que les images changent quand on passe du mode clair au sombre et inversement. Là on commence par la bannière, qui est intégrée dans la PA, et ça coince déjà parce que je ne sais pas comment "dupliquer" le code pour le coller dans la partie correspondant qu mode sombre avec la deuxième image...

Voilà le bout de code correspondant à la bannière dans la PA :

Code:

<div class="bann-forum">
                                          <a href="https://dwell-test-forum.forumactif.com/" target="_parent"><img style="object-fit:cover;border-radius:6px;filter: grayscale(40%);" src="https://www.zupimages.net/up/23/39/x8hg.gif" alt="bannière" /></a>
    </div>

Si l'url avait été dans la partie "style" ça aurait été easy mais là je sais pas comment faire ^^'
J'ai tenté ça :
html[data-color-scheme=dark], [data-color-scheme=dark] .bann-forum img {background:url(https://www.zupimages.net/up/23/37/ewgz.png)}

et des variantes, mais ça marche évidemment pas ;; J'ai tenté de modifier le code de base aussi, en intégrant l'url dans l'attribut style en mode background mais ça veut pas...

Si quelqu'un a la solution je suis preneuse, merci d'avance **

[Toryudo]

Bonjour !

Vous avez moyen de changer directement le src d'une image en CSS, comme ceci par exemple :

Code:

[data-color-scheme="dark"] .bann-forum img {
  content: url("https://i.pinimg.com/1200x/41/2f/49/412f499a639de1e18f46a28c3ace2e74.jpg");
}

[Yunie16]

Merci, ça fonctionne parfaitement ** Je garde l'astuce pour le reste si j'ai encore le cas pour d'autres images !