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

dark mode #1542

Open
varCepheid opened this issue Mar 24, 2024 · 4 comments · May be fixed by #1546
Open

dark mode #1542

varCepheid opened this issue Mar 24, 2024 · 4 comments · May be fixed by #1546
Assignees
Labels
enhancement Adds a new feature or meets a request.

Comments

@varCepheid
Copy link
Collaborator

Allow signed-in users to change the display to darker colors.

@varCepheid varCepheid added enhancement Adds a new feature or meets a request. up for grabs Open for someone to work on. labels Mar 24, 2024
@varCepheid
Copy link
Collaborator Author

@calebeby The background color is set in style.css. Is there a way I can modify that to change to black if a user requests it?

@varCepheid varCepheid self-assigned this May 7, 2024
@varCepheid varCepheid removed the up for grabs Open for someone to work on. label May 7, 2024
@calebeby
Copy link
Member

calebeby commented May 7, 2024

Can we instead use a media query instead? https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme

I think a combination of media query + css variables should make this work

@varCepheid
Copy link
Collaborator Author

Do you know if there's a way to change that value within the app? It seems like it's pulling only from the device or browser.

@varCepheid varCepheid linked a pull request May 7, 2024 that will close this issue
@calebeby
Copy link
Member

calebeby commented May 7, 2024

No that just uses the system setting (we should use that as the default). You can add a toggle with JS and custom properties that overrides the default.

Here is a very in-depth article that outlines several good options: https://css-tricks.com/a-complete-guide-to-dark-mode-on-the-web/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Adds a new feature or meets a request.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants