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).
Thanks for this awesome component, I’ve been looking for this! Unfortunately I can’t seem to get it to work. Perhaps something trivial but where do I find the dark theme id? Is that just the name of the theme?
Google Chrome now supports dark mode on iOS 13 and iPadOS 13. I’m not too sure about dark mode support for Google Chrome on MacOS Mojave or MacOS Catalina though.
it should work in Chrome already, under the hood it uses the prefers-color-scheme media query and browser support for it is pretty good nowadays: Can I use... Support tables for HTML5, CSS3, etc
Yeah, I also really hope that this becomes part of the standard Discourse install. Some people only like to update their forums and don’t really go beyond that.
@pmusaraj one thing I noticed is that the switching only works for logged in users, is there a way to also have it automatically set for anonymous users that haven’t created an account yet (e.g. switch to dark theme while using a private browser window)?
This component seems to create an issue with 2.4.0.beta11+39. In my registered-users-only community the login screen at https://mydomain/login is blank. It works normally when this component is deactivated.
I can’t reproduce this locally with latest Discourse and latest version of the component. When the login screen is blank, is there an error in the browser console?
Update: the issue Thomas was running into is now fixed in the component. Thanks for the report!
Discourse unterstützt nun Automatic Dark Mode color scheme switching im Kern. Diese Komponente ist veraltet und sollte nicht mehr verwendet werden.
