Skip to content
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

Initial LocalStorage value doesn't match OS preferred theme #156

Open
egeesin opened this issue Jan 11, 2025 · 0 comments
Open

Initial LocalStorage value doesn't match OS preferred theme #156

egeesin opened this issue Jan 11, 2025 · 0 comments
Labels
bug Something isn't working

Comments

@egeesin
Copy link

egeesin commented Jan 11, 2025

The script (with default options) doesn't detect prefer-color-scheme and set invalid LocalStorage darkMode value in the beginning. If my OS theme is dark mode and I'm visiting a page that is drkmd.js loaded for the first time, the page will still be in light mode as it doesn't detect the system theme. Even if I choose the default theme as dark in the script tag (data-drkmd-opts='{ "defaultTheme": "dark" }') or set data-theme=dark/body.theme-dark in the markup + my system theme is dark, it still sets the light theme automatically as darkMode=false in LocalStorage.

📚 To Reproduce

  1. Switch to dark mode in your operating system.
  2. Go to CodePen example.
  3. Open Web Inspector/DevTools and go to Application tab (Storage tab in Safari) to browse LocalStorage under cdpn.io
  4. In order to simulate the first visit, delete existing LocalStorage key from cdpn.io and reload the page.

💡 Expected behavior

Quoting from Browser Compatibility section in README:

drkmd.js uses prefers-color-scheme: dark to automatically enable the Dark Mode if the OS prefered theme is dark.

This.

⚙️ Environment

  • Using the latest version that is distributed on jsdelivr at the time of this issue opened.
@egeesin egeesin added the bug Something isn't working label Jan 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant