juanfernandes / juanfernandes-uk

Source files for my personal website built with Eleventy and hosted with Guru.co.uk.
1 stars 0 forks source link

🌗 Dark mode #31

Open juanfernandes opened 6 months ago

juanfernandes commented 6 months ago

As a user I want to be able to see a dark version of the website and be able to toggle this setting on and off.

Adding a little dark magic to the web https://medium.com/@dizzyup/adding-a-little-dark-magic-to-the-web-8eb82ce5fd91

https://paulmillr.com/posts/using-dark-mode-in-css/

Redesigning your product and website for dark mode https://stuffandnonsense.co.uk/blog/redesigning-your-product-and-website-for-dark-mode

https://blog.iconfactory.com/2018/10/dark-mode-and-css/

Learn CSS Variables in 5 minutes – freeCodeCamp https://medium.freecodecamp.org/learn-css-variables-in-5-minutes-80cf63b4025d?mc_cid=545e488581&mc_eid=ad1356f8b5

@Keithamus There you have it folks. If you want your site to work with macos Mojave's Dark Mode, there's a css media query for it: prefers-dark-interface.

https://t.co/ZwSM8V2qZM

hat-tip @jonrohan https://t.co/EvtgkV4JsK

Link to Tweet: https://twitter.com/Keithamus/status/1007557906378706944

@media (prefers-color-scheme: dark) {
  body {
    background: black;
    color: white;
  }
}