QOL: Use `darkMode: media` for automatic theme detection
Closed this issue · 2 comments
Most of the people don't enjoy when they use Dark mode on virtually anything they use and they enter a new product that shines out loud brightness on your face :c
Although solving this is dead-simple as changing darkMode
to media
in tailwind.config.cjs, since class
is hard-coded, I decided to open a issue before a PR to check if this is proposital or not
you have the green light to do this. i have been postponing this forever.
it is important to me that localStorage is prioritised over the OS setting (if localStorage is defined)
this means that:
- a user accessing the website for the first time (has no localStorage information) will load the light/dark mode corresponding to their prefers-color-scheme
- for a user reaccessing the website, if they have a localStorage preference (e.g: they clicked the light/dark mode toggle at least once) that is what will be loaded. even if the prefers-color-scheme says otherwise.
example: user has dark mode preferred on system > first load is dark mode > user clicks the "light mode" toggle on phived > closes the website
regardless of the OS setting, all future loads will be light mode, until they click the "dark mode" toggle (or clear their cache, which would clear localStorage information as well).
I can make this @LukeberryPi !