Add light mode support

[fyang151]

Description

• Resolves LIGHT MODE! #673

This PR adds support for light mode by:

• Keeping colours as variables in variables.css.
• Setting dark mode in dom before paint with new function in file themeNoFlashScript.
• Storing our theme using Redux by creating a slice in themeSlice.ts. This is intentionally done differently than our current way of implementing Redux to serve as an example for our possible migration to RTK in the future: Update to RTK #654
• Adding a button to toggle the theme.

Added color changes and .css variables to light mode branch

change colors later

[minjunminji]

this can throw in storage-restricted contexts and also toggles arbitrary class names if stored is unexpected. i think wrapping in try/catch and only apply 'dark' when stored === 'dark', then otherwise explicitly remove 'dark' for light/default

[fyang151]

Done! 73cc919

[minjunminji]

for the
document.documentElement.classList.toggle(...) localStorage.setItem(...)
lines (20, 24, etc),

reducers should stay pure and this side-effect code can throw during dispatch (localStorage failures). imo should move DOM/storage writes to middleware/listener/effect, or at minimum guard writes with try/catch so toggle dispatch can't crash

[fyang151]

What was I doing....
It should be fixed here: 5710eb8

[minjunminji]

interactive control is a div, so it's not keyboard accesible by default
could use semantic <button type="button"> with aria-label (e.g. "Toggle theme") and preserve current styling via CSS

[fyang151]

Done! 73cc919