5d-diplomacy-with-multiverse-time-travel
5d-diplomacy-with-multiverse-time-travel copied to clipboard
Oliveriver
Add Dark Mode
Resolves #33
Looks like this
The approach I took to detecting dark mode (use OS preference) means there is no toggle within the app, but that should be easy to add in a follow-up PR if wanted (and if you want to force dark mode, just add class="dark" to index.html.
~~Doesn't touch the images within the public folder as while I could edit the background on them, I was hoping someone has the source files and could easily do it instead.~~ Done this now by hand.
~~I've tried to minimise the number of colours defined outside of colours.ts so it should be easy to update the colours if wanted.~~ All colours are in colours.ts now.
~~The theme isn't properly dynamic, so if you change the OS colour theme preference, the app won't fully update before a refresh. The proper solution to this would require moving the theme into a React Hook and I didn't want to go through that effort due to the large number of places currently importing colours.ts but I can do that if wanted.~~ Done this now via CSS variables
