Light/Dark mode using prefers-color-scheme

crybapp / web

Main web client for Cryb

MIT License

45 stars 14 forks source link

Light/Dark mode using prefers-color-scheme #62

Closed Simonx22 closed 5 years ago

Simonx22 commented 5 years ago

This PR adds a light/dark mode for all pages!

it's using prefers-color-scheme which is supported on the latest versions of Firefox, Google Chrome, and Safari
dark theme will be used if the OS doesn't support a dark/light theme OR the browser doesn't support prefers-color-scheme

ScreenRecording2019-10-20at22054

Future:

change the favicon depending on if in light or dark mode. (Will try to take a look at this after the PR has been merged)

Closes #26

darnfish commented 5 years ago

This is really cool! I'll test this locally and change some code if there's any changes we need to make it so it matches our code style and then I'll merge once you're ready. Thanks for the contribution!

Simonx22 commented 5 years ago

This is basically done now. I fixed the issues with the index and the create-a-room page.

Screenshots:

JeDaYoshi commented 5 years ago

Merged now - thanks for your contribution, and again, sorry for the delay!