From 4477d214a9b48411e08aa3515472ae0ff053c21a Mon Sep 17 00:00:00 2001 From: freearhey <7253922+freearhey@users.noreply.github.com> Date: Wed, 15 Nov 2023 11:29:02 +0300 Subject: [PATCH] Fixes dark mode toggle https://github.com/iptv-org/iptv-org.github.io/pull/1550 --- src/components/ToggleModeButton.svelte | 14 ++++++++++---- src/pages/+layout.svelte | 9 +++++---- 2 files changed, 15 insertions(+), 8 deletions(-) diff --git a/src/components/ToggleModeButton.svelte b/src/components/ToggleModeButton.svelte index 575102bfc..6855ddd4c 100644 --- a/src/components/ToggleModeButton.svelte +++ b/src/components/ToggleModeButton.svelte @@ -4,8 +4,11 @@ let dark = false function toggleDarkMode() { - let mode = localStorage.theme || 'light' - if (mode === 'dark' || window.matchMedia('(prefers-color-scheme: dark)').matches) { + const prefersColorScheme = window.matchMedia('(prefers-color-scheme: dark)').matches + ? 'dark' + : 'light' + const mode = localStorage.theme || prefersColorScheme + if (mode === 'dark') { dark = false document.documentElement.classList.remove('dark') localStorage.theme = 'light' @@ -17,8 +20,11 @@ } onMount(() => { - let mode = localStorage.theme || 'light' - if (mode === 'dark' || window.matchMedia('(prefers-color-scheme: dark)').matches) { + const prefersColorScheme = window.matchMedia('(prefers-color-scheme: dark)').matches + ? 'dark' + : 'light' + const mode = localStorage.theme || prefersColorScheme + if (mode === 'dark') { dark = true } else { dark = false diff --git a/src/pages/+layout.svelte b/src/pages/+layout.svelte index 645cf33f1..96ff24b2e 100644 --- a/src/pages/+layout.svelte +++ b/src/pages/+layout.svelte @@ -5,13 +5,14 @@