feat: change theme dynamically when system preferences change (#7956)

This commit is contained in:
Matthew Holloway 2024-09-25 03:53:08 +12:00 committed by GitHub
parent 5581dc79e1
commit 5ea4cc13bb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -30,6 +30,7 @@ const appContainer = ref(null)
// Set user theme
// --------------------------------------------------------------------
function updateTheme() {
const desiredTheme = window.localStorage?.getItem('theme')
if (desiredTheme === 'dark') {
siteStore.theme = 'dark'
@ -40,6 +41,12 @@ if (desiredTheme === 'dark') {
} else {
siteStore.theme = 'light'
}
}
updateTheme()
// this change event fires for either light or dark changes
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', updateTheme)
// --------------------------------------------------------------------
// Handle browser resize