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 for docs #266

Open
p3nGu1nZz opened this issue Jun 7, 2023 · 2 comments
Open

Dark mode for docs #266

p3nGu1nZz opened this issue Jun 7, 2023 · 2 comments

Comments

@p3nGu1nZz
Copy link

It should be able to match the similar dark mode color scheme on GitHub and visual studio code

@trusktr
Copy link
Member

trusktr commented Jun 8, 2023

Would be nice! We're using docsify-themeable for the base CSS Docsify theme.

Searching for "dark mode" in docsify-themeable's sidebar will lead you to this section:

https://jhildenbiddle.github.io/docsify-themeable/#/quick-start?id=existing-site

Where it will specify how to apply light/dark mode style sheets. That particular tip will have us load one base style or the other.

We can also do similar with our custom style overrides so that we override both the light and dark theme. Our style overrides are here:

https://github.com/lume/lume.github.io/tree/main/styles

In particular, variables.css contains overrides of docsify-themeable variables, and there are probably some style rule overrides in the other files too.

We will need to use prefers-color-scheme queries in our custom styles, and to provide alternative values for docsify-themeable variables.

@trusktr
Copy link
Member

trusktr commented Jun 8, 2023

Sidenote, I'm a maintainer of Docsify. I have it converted to Solid.js in a branch. You can ask me if you have any questions about it, and there is also a Docsify Discord ( https://discord.gg/docsify ).

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

No branches or pull requests

2 participants