Diese Komponente ermöglicht das automatische Umschalten auf ein dunkles Theme, wenn der Browser im Dunkelmodus eingestellt ist. Dies funktioniert nur für angemeldete Benutzer in allen Browsern, die die Media-Abfrage prefers-color-scheme unterstützen.
Standardmäßig ist diese Komponente aktiviert, und einzelne Benutzer können sie in ihrem Bereich Einstellungen > Oberfläche deaktivieren. Administratoren können die Komponente auch standardmäßig deaktivieren. In diesem Fall sehen Benutzer einen Button, um das automatische Umschalten in ihren Oberflächeneinstellungen zu aktivieren.
Wie funktioniert es?
Wenn der Browser im Dunkelmodus ist, lädt diese Komponente Discourse mit aktiviertem dunklem Theme neu. Kehrt der Browser zum Hellmodus zurück, lädt die Komponente mit dem standardmäßig aktivierten Theme neu.
Es wird auch neu geladen, wenn der Dunkelmodus umgeschaltet wird, während sich der Benutzer auf der Website befindet (wie im obigen Video gezeigt).
(Wenn mehr als zwei Themes aktiviert sind und der Benutzer ein Theme außer dem Standard- oder Dunkel-Theme ausgewählt hat, führt diese Komponente keine Aktion aus, d. h. sie respektiert die Auswahl des Benutzers.)
Konfiguration
Stellen Sie sicher, dass ein dunkles Theme installiert ist und von Benutzern auswählbar ist.
Fügen Sie diese Komponente sowohl dem Standard-Theme als auch dem dunklen Theme hinzu (sehr wichtig: Wenn Sie sie nicht zu beiden Themes hinzufügen, können Benutzer nicht zum Standard-Theme zurückkehren).
Geben Sie in den Komponenteneinstellungen die ID Ihres dunklen Themes in dark theme id ein.
I just pushed a small update to this theme component to make it compatible with iOS 13 (which will ship with Dark Mode as well as an option to automatically enable it in the evenings).
Danke für diese großartige Komponente, ich habe genau danach gesucht! Leider scheint es bei mir nicht zu funktionieren. Vielleicht ist es etwas Triviales, aber wo finde ich die ID des dunklen Themas? Ist das einfach der Name des Themas?
Die ID ist die Nummer des Themes in der URL, wenn du es im Admin-Bereich ausgewählt hast. In dieser URL: /admin/customize/themes/39 ist sie beispielsweise 39.
Google Chrome unterstützt jetzt den Dunkelmodus unter iOS 13 und iPadOS 13. Bei der Unterstützung des Dunkelmodus für Google Chrome unter macOS Mojave oder macOS Catalina bin ich mir jedoch nicht sicher.
Wann wird die Unterstützung für Google Chrome eingeführt?
Es sollte in Chrome bereits funktionieren. Im Hintergrund wird die Media-Query prefers-color-scheme verwendet, und die Browserunterstützung dafür ist heutzutage recht gut: Can I use... Support tables for HTML5, CSS3, etc
Ja, ich hoffe ebenfalls sehr, dass dies Teil der Standard-Discourse-Installation wird. Manche Leute aktualisieren ihre Foren nur und gehen nicht wirklich darüber hinaus.
@pmusaraj Mir ist aufgefallen, dass die Umschaltung nur für angemeldete Benutzer funktioniert. Gibt es eine Möglichkeit, dies auch automatisch für anonyme Benutzer festzulegen, die noch kein Konto erstellt haben (z. B. Umschaltung auf das dunkle Design bei Verwendung eines privaten Browserfensters)?
Dieses Komponente scheint ein Problem mit 2.4.0.beta11+39 zu verursachen. In meiner Community nur für registrierte Benutzer ist der Login-Bildschirm unter https://mydomain/login leer. Es funktioniert normal, wenn diese Komponente deaktiviert ist.
Ich kann das lokal mit der neuesten Version von Discourse und der neuesten Komponentenversion nicht reproduzieren. Wenn der Anmeldebildschirm leer ist, erscheint ein Fehler in der Browserkonsole?
Update: Das Problem, auf das Thomas gestoßen ist, wurde nun in der Komponente behoben. Vielen Dank für den Bericht!
Discourse unterstützt nun Automatic Dark Mode color scheme switching im Kern. Diese Komponente ist veraltet und sollte nicht mehr verwendet werden.
