fix: Switching pages will flash
This commit is contained in:
parent
46ebf792c7
commit
dac9537475
1 changed files with 17 additions and 0 deletions
|
@ -1,10 +1,27 @@
|
|||
<script lang="ts" setup>
|
||||
import { useDark, useToggle } from '@vueuse/core'
|
||||
import { onMounted, watchEffect } from 'vue'
|
||||
|
||||
const isDark = useDark()
|
||||
|
||||
const toggleDark = useToggle(isDark)
|
||||
|
||||
watchEffect(() => {
|
||||
if (isDark.value) {
|
||||
setDarkMode(document)
|
||||
}
|
||||
})
|
||||
|
||||
function setDarkMode(document: Document) {
|
||||
if (isDark.value)
|
||||
document.documentElement.classList.add('dark')
|
||||
}
|
||||
onMounted(() => {
|
||||
document.addEventListener('astro:before-swap', (event) => {
|
||||
setDarkMode(event.newDocument)
|
||||
})
|
||||
})
|
||||
|
||||
function toggleTheme(event: MouseEvent) {
|
||||
const x = event.clientX
|
||||
const y = event.clientY
|
||||
|
|
Loading…
Reference in a new issue