DibyashanuPati/quartz
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Execute darkmode script before first render

Browse source
This commit is contained in:
Brecht Savelkoul 2021-08-13 22:46:00 +02:00
parent 8850976d8d
commit f9920f6d73
5 changed files with 21 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

19
assets/darkmode.js
View file

@ -1,14 +1,8 @@
// Darkmode toggle
const toggleSwitch = document.querySelector('#darkmode-toggle')
const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'
const currentTheme = localStorage.getItem('theme') ?? userPref
if (currentTheme) {
document.documentElement.setAttribute('saved-theme', currentTheme);
if (currentTheme === 'dark') {
toggleSwitch.checked = true
}
}
const switchTheme = (e) => {
@ -22,5 +16,14 @@ const switchTheme = (e) => {
}
}
// listen for toggle
toggleSwitch.addEventListener('change', switchTheme, false)
window.addEventListener('DOMContentLoaded', () => {
// Darkmode toggle
const toggleSwitch = document.querySelector('#darkmode-toggle')
// listen for toggle
toggleSwitch.addEventListener('change', switchTheme, false)
if (currentTheme === 'dark') {
toggleSwitch.checked = true
}
})