handle auto color scheme

This commit is contained in:
srgooglo 2022-05-31 01:29:09 +02:00
parent 34370e0a46
commit 47580444a6

View File

@ -12,9 +12,11 @@ export default class StyleCore extends Core {
currentVariant = null
events = {
"app.autoDarkMode": (value) => {
"app.autoDarkModeToogle": (value) => {
if (value === true) {
this.handleAutoColorScheme()
}else {
this.applyVariant(this.getStoragedVariant())
}
},
"theme.applyVariant": (value) => {
@ -41,10 +43,10 @@ export default class StyleCore extends Core {
handleAutoColorScheme() {
const prefered = window.matchMedia("(prefers-color-scheme: light)")
if (window.app.settings.get("app.auto_darkMode") && !prefered.matches) {
if (!prefered.matches) {
this.applyVariant("dark")
}else {
this.applyVariant("false")
} else {
this.applyVariant("light")
}
}
@ -78,8 +80,16 @@ export default class StyleCore extends Core {
this.applyVariant(variantKey)
// handle auto prefered color scheme
if (window.app.settings.get("app.auto_darkMode")) {
window.matchMedia("(prefers-color-scheme: light)").addListener(this.handleAutoColorScheme)
window.matchMedia("(prefers-color-scheme: light)").addListener(() => {
console.log(`[THEME] Auto color scheme changed`)
if (window.app.settings.get("auto_darkMode")) {
this.handleAutoColorScheme()
}
})
if (window.app.settings.get("auto_darkMode")) {
this.handleAutoColorScheme()
}
}