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 dark theme #240

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

oliverfencott
Copy link

Hello, during my quest to learn Janet I often find myself browsing the site late at night and it's quite a strain on my eyes.
This PR minimally changes the 3 primary CSS files by adding media queries that use a dark theme when the user's OS/browser is set to dark.

In keeping with the style of the codebase, I've opted to inline colour values as opposed to using CSS variables. The majority of colours I've chosen are already present in the styling for the regular theme, save for one or two hand-picked shades of grey where necessary.

I've chosen to co-locate the media queries next to the classnames/ids that are affected. This leads to duplicated code (the same media selector) but simpler navigation.

Attached are some (very large) screenshots to give an idea of how the site looks with the changes.

homepage

docs

api

@sogaiu
Copy link
Contributor

sogaiu commented Dec 4, 2024

FWIW, as a work-around, I've been using https://darkreader.org/ with pretty good results.

(Not opposed to dark theme support, just mentioning :) )

@oliverfencott
Copy link
Author

oliverfencott commented Dec 4, 2024

FWIW, as a work-around, I've been using https://darkreader.org/ with pretty good results.

(Not opposed to dark theme support, just mentioning :) )

Thank you for the recommendation, I'll be sure to check it out!

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.

2 participants