Flarum CSS Code für Dark Mode

Cosmo

Hallo zusammen,

ich habe ebenfalls ein Forum mit Flarum umgesetzt und möchte nun das Design an meine Hauptseite anpassen. Was für den Light-Mode kein Problem ist, habe ich für den Dark-Mode noch nicht herausgefunden 😕.

Ich möchte zum Beispiel erreichen, dass dunkle Grafiken, wie hier beim Registrierungs-Widget, geladen werden. Ich hoffe, dass mir hier jemand einen Tipp geben kann 😉.

Tutrix

Cosmo
Das ist abhängig von der verwendeten Flarum-Version.

Ab Version 2.x reicht diese Formatierung

[data-theme^=dark] class oder id {
…..
…..
}

Für Version 1.x ist etwas mehr CSS notwendig

für Dark Mode

body when (@config-dark-mode = true) {
 class oder id {
 …..
 …..
 }
}

oder Light Mode

body when (@config-dark-mode = false) {
 class oder id {
 …..
 …..
 }
}

Cosmo

Hallo @Tutrix
Ich verwende Flarum Version 1.8.19 und teste nun gerade mit @config-dark-mode = true, leider funktioniert das bei mir nicht ☹️

Tutrix

Cosmo
Ich vermute, dass du über die Entwicklerwerkzeuge deines Browsers testest. Da funktioniert @config-dark-mode nicht, da dies erst intern in Flarum ausgeführt wird.
Du musst nur den Dark Mode in Flarum aktivieren und dein CSS ohne den umschließenden @config-dark-mode schreiben. Wenn alles passt diesen CSS mit @config-dark-mode umschließen und füge ihn in eine separate CSS-Datei oder bei „Individuelles CSS” ein.