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

Add auto dark/light theme switch based on OS preference #1770

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

vishwamartur
Copy link

@vishwamartur vishwamartur commented Dec 17, 2024

vishwamartur Medium vishwamartur /add-auto-theme-switch → Lissy93/dashy Commits: 1 | Files Changed: 2 | Additions: 18 Category Overview Quality Checklist Label Powered by Pull Request Badge

Related to #825

Add automatic theme switching based on OS preference

  • Add logic in src/mixins/ThemingMixin.js to detect OS theme preference using window.matchMedia.
  • Update initializeTheme method in src/mixins/ThemingMixin.js to set theme based on OS preference.
  • Modify applyLocalTheme method in src/mixins/ThemingMixin.js to apply the detected theme dynamically.
  • Include logic in src/App.vue to detect and apply theme based on OS preference during app initialization.

Related to Lissy93#825

Add automatic theme switching based on OS preference

* Add logic in `src/mixins/ThemingMixin.js` to detect OS theme preference using `window.matchMedia`.
* Update `initializeTheme` method in `src/mixins/ThemingMixin.js` to set theme based on OS preference.
* Modify `applyLocalTheme` method in `src/mixins/ThemingMixin.js` to apply the detected theme dynamically.
* Include logic in `src/App.vue` to detect and apply theme based on OS preference during app initialization.
Copy link

netlify bot commented Dec 17, 2024

Deploy Preview for dashy-dev ready!

Name Link
🔨 Latest commit c2bad0b
🔍 Latest deploy log https://app.netlify.com/sites/dashy-dev/deploys/6761a7d02f4ebf0008c7cc01
😎 Deploy Preview https://deploy-preview-1770--dashy-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant