aboutsummaryrefslogtreecommitdiffstats
path: root/pydis_site/static/js
diff options
context:
space:
mode:
authorGravatar hedy <[email protected]>2024-01-18 10:02:12 +0800
committerGravatar hedy <[email protected]>2024-01-18 10:02:12 +0800
commit05bbeda4e060f341a64b4d47fd618224f6b73bb1 (patch)
treebefe8d21ec2873579d751c66bdf4e4580e1b2968 /pydis_site/static/js
parentDark: Improve order of switching stylesheets (diff)
Dark: Set correct theme immediately when the script loads
This fixes the latency previously observed on page loads. We still have to put switch toggling after page loads though. Genius idea by wookie. Co-authored-by: wookie184 <[email protected]>
Diffstat (limited to 'pydis_site/static/js')
-rw-r--r--pydis_site/static/js/base/themes.js20
1 files changed, 10 insertions, 10 deletions
diff --git a/pydis_site/static/js/base/themes.js b/pydis_site/static/js/base/themes.js
index c1a5f006..9c279d21 100644
--- a/pydis_site/static/js/base/themes.js
+++ b/pydis_site/static/js/base/themes.js
@@ -59,19 +59,19 @@ function toggleThemeSwitch(newTheme) {
}
}
-// Executed when the page has finished loading.
-document.addEventListener("DOMContentLoaded", () => {
- let theme;
- const systemPrefersDark = window.matchMedia("(prefers-color-scheme: dark)");
+let theme;
+const systemPrefersDark = window.matchMedia("(prefers-color-scheme: dark)");
- if (systemPrefersDark.matches)
- theme = getCurrentTheme("dark");
- else
- theme = getCurrentTheme();
+if (systemPrefersDark.matches)
+ theme = getCurrentTheme("dark");
+else
+ theme = getCurrentTheme();
- setStyleSheets(theme);
- toggleThemeSwitch(theme);
+setStyleSheets(theme);
+// Executed when the page has finished loading.
+document.addEventListener("DOMContentLoaded", () => {
+ toggleThemeSwitch(theme);
systemPrefersDark.addEventListener("change", ({matches: isDark}) => {
const newTheme = isDark ? "dark" : "light";
// Let the new system preference take precedence over toggle preference