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

consider prefers-color-scheme if possible. #58

Closed
verfasor opened this issue Dec 27, 2019 · 0 comments
Closed

consider prefers-color-scheme if possible. #58

verfasor opened this issue Dec 27, 2019 · 0 comments
Assignees
Labels
enhancement New feature or request

Comments

@verfasor
Copy link

verfasor commented Dec 27, 2019

As we discussed over QQ, it's easy to implement prefers-color-scheme with WordPress.

This media query is compatible with almost all modern browsers.

You could either tell the theme to load darkmode.css if the user has set their system to dark mode

OR

add the CSS for dark mode with the main scss.

Here's the logic:

@media (prefers-color-scheme: dark) {
body  {
background-color: #121212;color: #fafafa;}
/* rest of the css */
}

@media (prefers-color-scheme: light)  {
body {
background-color: #fafafa;color: #121212;}
/* rest of the dark mode css */
}

You can refer to my blog post for clarity: https://mighil.com/automatic-dark-mode-for-wordpress/

功能描述
Talk about the details of the feature you request here.

附加内容
Add any other context or screenshots about the feature request here.

@verfasor verfasor added the enhancement New feature or request label Dec 27, 2019
@verfasor verfasor changed the title You may consider prefers-color-scheme instead of separate light/dark mode switcher. consider prefers-color-scheme if possible. Dec 27, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants