6 ms·
My goal is that it renders on GitHub as well as on my blog. GitHub doesn’t support css based dark mode afaik
by mlysk 6mo ago
My goal is that it renders on GitHub as well as on my blog. GitHub doesn’t support css based dark mode afaik
- tasuki 6mo agoAh, you have a button for the toggle! Did you know that you can conform to the user's light/dark preference with CSS? Like this: :root { --varname: #FFE; } @media (prefers-color-scheme: dark) { :root { --varname: #022; } } Edit: To expand on this, I dislike light/dark toggles. If I have dark mode on, seeing a bright screen and having to search for a toggle is jarring. Just show me the colours according to my preference!
- auraham 6mo agoHow can you detect the system preferences in the browser?
- tasuki 6mo agoI answered that in the comment you're replying to. If you want a more authoritative answer: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@media/prefers-color-scheme https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...
- pinjasaur 6mo agoLast I checked on this the workaround is embedding CSS inside an SVG, here's a demo: https://github.com/sindresorhus/css-in-readme-like-wat https://github.com/sindresorhus/css-in-readme-like-wat I used this on a personal project to add a README logo that is dark mode friendly: https://paul.af/github-readme-dark-mode https://paul.af/github-readme-dark-mode