diff options
Diffstat (limited to 'layouts/partials/header.html')
| -rw-r--r-- | layouts/partials/header.html | 7 |
1 files changed, 4 insertions, 3 deletions
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index c782397..a5d4497 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -76,6 +76,7 @@ </nav> <script> + // change icon and add listener if auto let element = document.getElementById('lightDarkMode') {{- if eq .Site.Params.colorScheme "light" }} if (storageColorScheme == 'Auto') { @@ -83,7 +84,7 @@ element.firstElementChild.setAttribute("data-icon", 'adjust') element.firstElementChild.classList.add('fa-adjust') document.addEventListener('DOMContentLoaded', () => { - switchMode('Auto') + window.matchMedia("(prefers-color-scheme: dark)").addEventListener('change', switchDarkMode) }) } else if (storageColorScheme == "Dark") { element.firstElementChild.classList.remove('fa-sun') @@ -96,7 +97,7 @@ element.firstElementChild.setAttribute("data-icon", 'adjust') element.firstElementChild.classList.add('fa-adjust') document.addEventListener('DOMContentLoaded', () => { - switchMode('Auto') + window.matchMedia("(prefers-color-scheme: dark)").addEventListener('change', switchDarkMode) }) } else if (storageColorScheme == "Light") { element.firstElementChild.classList.remove('fa-moon') @@ -106,7 +107,7 @@ {{- else }} if (storageColorScheme == null || storageColorScheme == 'Auto') { document.addEventListener('DOMContentLoaded', () => { - switchMode('Auto') + window.matchMedia("(prefers-color-scheme: dark)").addEventListener('change', switchDarkMode) }) } else if (storageColorScheme == "Light") { element.firstElementChild.classList.remove('fa-adjust') |