renun/BewlyBewly
1
0
Fork 0
mirror of https://github.com/BewlyBewly/BewlyBewly.git synced 2025-04-14 13:15:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: sync theme when loading page, close #736

Browse Source
This commit is contained in:
Stephen Zhou
2024-05-10 14:59:25 +08:00
parent a7488c188e
commit 6f19b29993
1 changed files with 3 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/contentScripts/index.ts
View File

@@ -1,7 +1,7 @@
import { createApp } from 'vue'
import 'uno.css'
import '~/styles/index.ts'
import '~/styles'
import App from './views/App.vue'
import { setupApp } from '~/logic/common-setup'
import { SVG_ICONS } from '~/utils/svgIcons'
@@ -73,15 +73,8 @@ function isSupportedPages() {
let beforeLoadedStyleEl: HTMLStyleElement | undefined
if (isSupportedPages()) {
const isDarkSystemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches
// Since using runWhenIdle does not instantly inject the app to the page, a style class cannot be injected immediately to the <html> tag
// We have to manually add a class to the <html> app to ensure that the transition effect is applied
if (
(settings.value.adaptToOtherPageStyles && settings.value.theme === 'dark')
// Fix: flash dark mode when using the light theme
|| (settings.value.adaptToOtherPageStyles && (isDarkSystemTheme && settings.value.theme !== 'light'))
)
document.documentElement.classList.add('dark')
if (settings.value.adaptToOtherPageStyles)
useDark()
if (settings.value.adaptToOtherPageStyles)
document.documentElement.classList.add('bewly-design')