deployn/astro-deploy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: fix darkmode after page transitions

Browse Source
This commit is contained in:
Jewgeni Lewash 2024-03-10 12:19:36 +01:00
parent 930fd50ee8
commit 488fea300c
1 changed files with 18 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/layout/Header.astro
View File

@ -29,6 +29,24 @@ const navLinks = [
}); });
observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] }); observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });
} }
function setTheme(document) {
const theme =
localStorage.getItem('theme') ||
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
document.documentElement.setAttribute('data-theme', theme);
if (theme === 'dark') {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark');
}
}
setTheme(document);
document.addEventListener('astro:before-swap', (ev) => {
setTheme(ev.newDocument);
});
</script> </script>
<header <header