Automatisches Übertragen von CSS im Hellen zum Dunklen Farbschema

  • Affected Version
    WoltLab Suite 6.0
    Affected App
    WoltLab Suite Core

    Mir ist das bei meinen Designs Aufgefallen. Ob es jetzt ein Fehler ist oder gewollt ka.

    Dann habe ich es mit einem neuen WoltLab Design inklusive Dark Mode getestet.

    Trage ich im Hellen Farbschema ein CSS Code ein und klicke auf Dunkles Farbschema bearbeiten ist das dort auch eingetragen.

    Verändere ich nur im Hellen Farbschema die im Beispiel Screen 2px auf 1px ist das auch im Dunklen Farbschema schon Eingetragen.

    Die sollten getrennt voneinander sein und nicht Automatisch Anpassungen übernehmen die für ein Farbschema sind.

  • Alexander Ebert September 10, 2023 at 11:03 PM

    Added the Label Works as designed
  • Individuelles CSS und SCSS ist dasselbe Eingabefeld, es gibt lediglich ein zusätzliches Eingabefeld für den Dark Mode. Beide Felder sind unabhängig vom aktiven Farbschema.

    Also, das "normale" CSS-SCSS-Eingabefeld gilt also global für Hell und Dunkel, und lediglich das zusätzliche Eingabefeld nur für den Dark-Mode greift auch logischerweise nur bei diesem. Ich nehme an das Feld für den Dark-Mode hat bei Codes die sich widersprechen die höhere Priorität?

  • Also, das "normale" CSS-SCSS-Eingabefeld gilt also global für Hell und Dunkel, und lediglich das zusätzliche Eingabefeld nur für den Dark-Mode greift auch logischerweise nur bei diesem.

    Genau so ist es. Technisch gesehen wird der Wert des 2. Feldes in ein html[data-color-scheme="dark"] { /* … */ } eingeschlossen.

    Ich nehme an das Feld für den Dark-Mode hat bei Codes die sich widersprechen die höhere Priorität?

    Ja. Es steht im generierten CSS nach dem ersten Feld und hat als Präfix den zuvor genannten Selektor.

  • Hm, also ich hatte vorhin das Phänomen, dass in der hellen und in der dunklen Variante unter „Individuelles CSS und SCSS (dunkles Farbschema)“ andere Formatierungen standen. Übernommen wurden offenbar die Formatierungen aus der hellen Variante. Wenn man die dunkle Variante bearbeitet, sieht man nicht wirklich, welche Einstellungen sich beide Varianten teilen und welche nicht; ins Feld „Individuelles CSS und SCSS (dunkles Farbschema)“ sollte man dort wohl eher nichts eintragen, das führte bei mir dazu, dass die Formatierungen beim Absenden einfach verschwanden.

  • Hm, also ich hatte vorhin das Phänomen, dass in der hellen und in der dunklen Variante unter „Individuelles CSS und SCSS (dunkles Farbschema)“ andere Formatierungen standen. Übernommen wurden offenbar die Formatierungen aus der hellen Variante. Wenn man die dunkle Variante bearbeitet, sieht man nicht wirklich, welche Einstellungen sich beide Varianten teilen und welche nicht; ins Feld „Individuelles CSS und SCSS (dunkles Farbschema)“ sollte man dort wohl eher nichts eintragen, das führte bei mir dazu, dass die Formatierungen beim Absenden einfach verschwanden.

    Kann ich bestätigen. Das scheint aber bei weitem nicht der einzige weirde Fehler zu sein.

  • Moin

    Ich erkläre mal was mein Fehler war.

    Ich habe das dunkle Farb schema aktiviert und im oberen Bereich mein CSS Code eingegeben.

    Dann habe ich im Farb Editor die Farben geändert und schwups war das helle weg.

    Wir kennen alle den Aufbau, vorne Einstellungen, dann Farb Editor und dann im letzten Tab kommt oben der CSS Code rein.

    Wenn man jetzt das dunkle Design aktiviert und bearbeitet gibt es eine große Veränderung.

    Im letzten Tab individuelle CSS und Co darf man im oberen ersten Feld das sichtbar ist nichts eintragen.

    Nur in dem unteren Feld CSS für das dunkle Design.

    Der Farb Editor ist in diesem Modus für das dunkle Design.

    Wenn man jetzt auf das helle Design wechselt ist der Farb Editor für das helle Design.

    Aber man hat im letzten Tab individuell CSS beide Ebenen zur Verfügung, oben hell unten dunkel.

    Gilt für beide Versionen.

    Ich brauchte eine Weile bis ich damit zurecht gekommen bin.

    Was aber echt unschön ist.

    Nehmt zwei Bilder, HD, tragt beide ins CSS als body ein.

    Also einmal im hellen und einmal im dunklen.

    Im dunklen Design wird das helle Bild dennoch geladen.

    Nur überdeckt vom dunklen, Möglichkeit ist jetzt nur,

    In einer Version anderen Parameter zu nutzen oder im hellen mit Dark Mode Hinweis auf none zu setzen.

    Lucent ist zb jetzt fertig aber kostet echt viel Zeit.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!