From 5006acd6baaa2249c9710bab213338dd6927e472 Mon Sep 17 00:00:00 2001 From: Sijisu Date: Thu, 5 Aug 2021 09:13:05 +0000 Subject: [PATCH] Respect system dark-mode setting --- themes/patek/assets/js/dark-mode.js | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/themes/patek/assets/js/dark-mode.js b/themes/patek/assets/js/dark-mode.js index d5c45b0..7cc5468 100644 --- a/themes/patek/assets/js/dark-mode.js +++ b/themes/patek/assets/js/dark-mode.js @@ -1,6 +1,14 @@ function restoreDarkmode() { + const prefersDarkMode = window.matchMedia("(prefers-color-scheme: dark)"); const elem = document.getElementById("content"); - if (elem && document.cookie.includes("dark-mode=true")) { + + if (!document.cookie.includes("dark-mode=")) { + if (elem && prefersDarkMode.matches) { + elem.classList.add("dark-mode"); + } + } + + if (elem && document.cookie.includes("dark-mode=on")) { elem.classList.add("dark-mode"); } } @@ -11,10 +19,10 @@ function toggleDarkmode() { const state = elem.classList.toggle("dark-mode"); if (state) { // 31536000 = 1 year; not setting max-age would make it session bound - document.cookie = "dark-mode=true; path=/; max-age=31536000; secure; samesite=strict"; + document.cookie = "dark-mode=on; path=/; max-age=31536000; secure; samesite=strict"; } else { - // Delete the cookie by immediately expiring it - document.cookie = "dark-mode=; path=/; max-age=0; secure; samesite=strict"; + // We have to set the off preference as well, so it can override the OS setting + document.cookie = "dark-mode=off; path=/; max-age=31536000; secure; samesite=strict"; } } }