diff options
| author | Jakob Stendahl <jakob.stendahl@outlook.com> | 2022-04-28 15:40:45 +0200 |
|---|---|---|
| committer | Jakob Stendahl <jakob.stendahl@outlook.com> | 2022-04-28 15:40:45 +0200 |
| commit | 365105df0ee6f7d71aed03263783fde840b5b455 (patch) | |
| tree | 1794af6a51b181a15de82025c4ed06211b645f61 /src | |
| parent | 9366789872670a4fefd546bb3469def98d3e0b3d (diff) | |
| download | Aurora-data-365105df0ee6f7d71aed03263783fde840b5b455.tar.gz Aurora-data-365105df0ee6f7d71aed03263783fde840b5b455.zip | |
Make theme follow system theme
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Forecast/ForecastDrawer.svelte | 2 | ||||
| -rw-r--r-- | src/stores.ts | 17 |
2 files changed, 17 insertions, 2 deletions
diff --git a/src/components/Forecast/ForecastDrawer.svelte b/src/components/Forecast/ForecastDrawer.svelte index 0fdab29..16ed509 100644 --- a/src/components/Forecast/ForecastDrawer.svelte +++ b/src/components/Forecast/ForecastDrawer.svelte @@ -19,7 +19,7 @@ height: 100%; overflow: hidden; align-self: stretch; - box-shadow: 0px -6px 7px 0px black; + box-shadow: var(--elevation-1-shadow); } @media (min-width: 640px), (min-height: 720px) { diff --git a/src/stores.ts b/src/stores.ts index 16dc03e..468efca 100644 --- a/src/stores.ts +++ b/src/stores.ts @@ -1,6 +1,21 @@ -import { writable, readable } from 'svelte/store'; +import { writable, readable, get } from 'svelte/store'; +// Choose dark or light mode. export const theme = writable('light'); +function check_system_theme() { + if (typeof window === "undefined") { return; } + let system_theme = window.matchMedia("(prefers-color-scheme:dark)").matches ? "dark" : "light"; + if (system_theme != get(theme)) { theme.set(system_theme); } +} +setInterval(check_system_theme, 1000); +theme.subscribe(value => { + if (typeof window === "undefined") { return; } + if (value == "dark") { + window.document.body.classList.add("dark"); + } else { + window.document.body.classList.remove("dark"); + } +}); /* * the different data sources are |