Follow dark mode preference #30
Conversation
|
Awesome, can you run |
|
Also curious, I am unable to test this on Windows and Mac. Would I be able to test this on a CCRMA linux machine? |
|
You can set dark or light mode directly in your browser. In Firefox it's in the General tab under Website appearance. Automatic would be set by your desktop environment or operating system. In Chromium it's in Appearance -> Mode. Unfortunately setting it directly to light or dark is broken for me. The automatic part (Device) works though. Maybe it's only broken on Linux?! |
|
I'm not sure when this was added in macOS and Safari, but there should be the same options as in Gnome and Firefox/Chrome. |
|
Hmm interesting, I'm trying to switch light and dark mode settings on Chrome (Windows) but it doesn't seem to do anything. Maybe this only works on Linux or Gnome? In the past, the IDE theme used to similarly read browser light/dark mode but I ran into the issue of if your OS was dark but you wanted a light IDE, what is the source of truth? If you manually set it to light, how should the theme load after refreshing the page? Because of this confusion, I removed reading the browser theme to be OS theme agnostic. |
|
In Chromium it didn't work for me either. I think that's a browser bug because it even follows my desktop setting when I explicitly choose dark mode. I checked that with this github repo page as github implements this too. Be aware that Github's main page (not logged in) is always dark. |
Oh, I see. I think the correct thing to do then would be to save the setting as a cookie and have the options dark, light, and system. We do the same as the browser itself. |
Gotcha, yeah we only save the cookie for light/dark, not yet system. That would be a good feature... |
|
This mostly works now. Though removing the Event Listener doesn't work. So even if you chose dark or light mode it still follows your browser or desktop setting. Maybe you understand why this doesn't work. |
|
Format and lint don't agree on the formatting of switch statements? |
ntonnaett
force-pushed
the
dark_mode_preference
branch
from
fa5f106 to
8c169a1
Compare
|
Okay, I just didn't remove the event listener but returned early instead if colorPreference is not "system". This works now. It's rebased and ready to be merged. I could make the history more beautiful though. Or squash it? |
|
I've implemented what we talked about on the way home. What do you think about the wording? |
|
The dark mode toggle is now gone when turning on system preference. |
ntonnaett
force-pushed
the
dark_mode_preference
branch
from
96f244d to
7b6d9d5
Compare
|
Rebased to dev. |
|
It all seems to work! Could you put ChucK time first in the view dropdown to save a label? This way dark mode would be at the end of the dropdown? Then we can just call the label |
|
I know you removed the button now but when it was system but did you like the disabled button look? You can add |
|
Obey to Terry's orders ✓ I forgot about the disabled option. I think it's better. |
|
LGTM |
This sets the the color scheme according to prefers-color-scheme (that follows the global dark mode setting in Gnome). You can still toggle the dark mode from the menu.