diff --git a/packages/app/src/extensions/theme.extension.jsx b/packages/app/src/extensions/theme.extension.jsx index 913dcce9..78259161 100644 --- a/packages/app/src/extensions/theme.extension.jsx +++ b/packages/app/src/extensions/theme.extension.jsx @@ -31,32 +31,7 @@ export default class ThemeExtension extends Extension { this.resetDefault() }) - let theme = this.getStoragedTheme() - const modifications = this.getStoragedModifications() - const variantKey = this.getStoragedVariant() - - if (!theme) { - // load default theme - theme = this.getDefaultTheme() - } else { - // load URL and initialize theme - } - - // set global theme - this.theme = theme - - // override with static vars - if (theme.staticVars) { - this.update(theme.staticVars) - } - - // override theme with modifications - if (modifications) { - this.update(modifications) - } - - // apply variation - this.applyVariant(variantKey) + await this.initialize() }, ] @@ -64,6 +39,36 @@ export default class ThemeExtension extends Extension { return document.documentElement.style.getPropertyValue("--themeVariant") } + initialize = async () => { + let theme = this.getStoragedTheme() + + const modifications = this.getStoragedModifications() + const variantKey = this.getStoragedVariant() + + if (!theme) { + // load default theme + theme = this.getDefaultTheme() + } else { + // load URL and initialize theme + } + + // set global theme + this.theme = theme + + // override with static vars + if (theme.staticVars) { + this.update(theme.staticVars) + } + + // override theme with modifications + if (modifications) { + this.update(modifications) + } + + // apply variation + this.applyVariant(variantKey) + } + getRootVariables = () => { let attributes = document.documentElement.getAttribute("style").trim().split(";") attributes = attributes.slice(0, (attributes.length - 1)) @@ -108,7 +113,7 @@ export default class ThemeExtension extends Extension { window.app.settings.set("primaryColor", this.theme.staticVars.primaryColor) - return this.init() + this.initialize() } update = (update) => {