Add a manual light/dark mode switcher
Despite the simplicity of the commit title, this was a pretty big change. The styling used to just go off of the system's color scheme, but that can't be overridden. Instead, I have made a variable that determines whether dark theme is active and made a small panel with some buttons to change the theme. I had to change a lot of code to achieve this and lost a lot of hair (I metaphorically pulled it out) from writing this code. I also changed things from legacy mode to rune mode (Svelte 4 to 5) while I was at it, that wasn't too big.
This commit is contained in:
15
src/script/theme.ts
Normal file
15
src/script/theme.ts
Normal file
@ -0,0 +1,15 @@
|
||||
/*/
|
||||
* I know that having a source file this small is a bit silly,
|
||||
* but I think it's probably a good way to do this. Since multiple
|
||||
* components need the theme enum, why not define it in one place.
|
||||
* I also think it's funny for a source file to have more comments
|
||||
* than code. This will probably be changed in a future refactor.
|
||||
*
|
||||
* Also JavaScript enums suck (hot take)
|
||||
/*/
|
||||
|
||||
export var themes = {
|
||||
LIGHT: "light",
|
||||
DARK: "dark",
|
||||
AUTO: "auto",
|
||||
};
|
Reference in New Issue
Block a user