fix links page theme with trigger change theme event

nemanjam · Aug 22, 2024 · ab130bf · ab130bf
1 parent a38858f
commit ab130bf
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/src/components/ThemeScript.astro b/src/components/ThemeScript.astro
@@ -164,6 +164,11 @@ const defaultThemes = getDefaultThemes();
   darkModePreference.addEventListener('change', (event) => {
     const newMode = event.matches ? MODES.dark : MODES.light;
     const newTheme = getThemeFromMode(newMode);
-    setTheme(newTheme);
+
+    // trigger event instead of setTheme(newTheme), for Links page
+    const payload = { detail: { theme: newTheme } };
+    const themeChangeEvent = new CustomEvent(CHANGE_EVENT, payload);
+
+    document.dispatchEvent(themeChangeEvent);
   });
 </script>
diff --git a/src/pages/links.astro b/src/pages/links.astro
@@ -55,9 +55,8 @@ const { GITHUB_MARKDOWN_BODY_ID } = SELECTORS;
   const { CHANGE_EVENT } = THEME_CONFIG;
   const { GITHUB_MARKDOWN_BODY_SELECTOR } = SELECTORS;
 
-  const markdownBodyElement = document.querySelector(GITHUB_MARKDOWN_BODY_SELECTOR);
-
   const loadGithubTheme = (mode: Mode) => {
+    const markdownBodyElement = document.querySelector(GITHUB_MARKDOWN_BODY_SELECTOR);
     if (!markdownBodyElement) return;
 
     if (markdownBodyElement && mode === MODES.dark)