-
-
Notifications
You must be signed in to change notification settings - Fork 245
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
CSS-based dark mode #325
CSS-based dark mode #325
Conversation
I haven't done a full review yet, but I am definitely in favor of swapping darkmode.js out for a pure CSS dark mode. That being said, https://caniuse.com/#search=prefers-color-scheme Before this is merged I would like to see a few enhancements.
|
Alright: I added a drop down menu beneath the language selector that lets users specify their theme. I also set it up in a way that it's easy to add additional themes, if we were to come up with more accessible options. (See #254) I don't have a device / browser currently that doesn't support dark mode, but I'm fairly confident that it handles that situation properly. |
I found an old copy of Firefox on my computer, so I was able to test browsers that don't support automatic switching - all good. Just had to make a quick update since it wasn't loading the strings. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks good, thank you :)
This creates a new CSS-based dark mode that automatically responds to the device's preferred mode. This fixes #317, #233, and should close #70.
I came up with the color scheme myself, trying to make it an appropriate match to the light theme. I'm totally open to changes. One advantage of this method is that it's really easy to update colors.
Since there's no more need for darkmode.js, the one downside is that there's not a toggle button for folks who want to override which color scheme gets used, but it's entirely possible to set up a button again. If there's interest in that, I can figure something out!
The one thing I want to note is that there's a lot of different shadow color values - I thought about simplifying these, but ended up just leaving them in for now.
Here's some pics of what it looks like: