diff --git a/app/scripts/plugins/plugin.js b/app/scripts/plugins/plugin.js index bd2873dd..9a52e456 100644 --- a/app/scripts/plugins/plugin.js +++ b/app/scripts/plugins/plugin.js @@ -303,27 +303,35 @@ class Plugin extends Model { } applyCss(name, data, theme) { - return Promise.resolve().then(() => { - const blob = new Blob([data], { type: 'text/css' }); - const objectUrl = URL.createObjectURL(blob); - const id = 'plugin-css-' + name; - const el = this.createElementInHead('link', id, { - rel: 'stylesheet', - href: objectUrl - }); - el.addEventListener('load', () => URL.revokeObjectURL(objectUrl)); - if (theme) { - const locKey = this.getThemeLocaleKey(theme.name); - SettingsManager.allThemes[theme.name] = locKey; - BaseLocale[locKey] = theme.title; - for (const styleSheet of Array.from(document.styleSheets)) { - if (styleSheet.ownerNode.id === id) { - this.processThemeStyleSheet(styleSheet, theme); - break; + return new Promise((resolve, reject) => { + try { + const blob = new Blob([data], { type: 'text/css' }); + const objectUrl = URL.createObjectURL(blob); + const id = 'plugin-css-' + name; + const el = this.createElementInHead('link', id, { + rel: 'stylesheet', + href: objectUrl + }); + el.addEventListener('load', () => { + URL.revokeObjectURL(objectUrl); + if (theme) { + const locKey = this.getThemeLocaleKey(theme.name); + SettingsManager.allThemes[theme.name] = locKey; + BaseLocale[locKey] = theme.title; + for (const styleSheet of Array.from(document.styleSheets)) { + if (styleSheet.ownerNode.id === id) { + this.processThemeStyleSheet(styleSheet, theme); + break; + } + } } - } + this.logger.debug('Plugin style installed'); + resolve(); + }); + } catch (e) { + this.logger.error('Error installing plugin style', e); + reject(e); } - this.logger.debug('Plugin style installed'); }); } diff --git a/app/styles/base/_theme-vars.scss b/app/styles/base/_theme-vars.scss index 83b2fb51..1e47ae73 100644 --- a/app/styles/base/_theme-vars.scss +++ b/app/styles/base/_theme-vars.scss @@ -1,54 +1,26 @@ +/* prettier-ignore */ +/* This file is also parsed in JS to build theme styles, see theme-vars.js */ @function set-theme-vars($t) { @return map-merge( $t, ( - muted-color: - mix( - map-get($t, medium-color), - map-get($t, background-color), - map-get($t, mute-percent) - ), - muted-color-border: - mix( - map-get($t, medium-color), - map-get($t, background-color), - semi-mute-percent(map-get($t, mute-percent)) - ), + muted-color: mix(map-get($t, medium-color), map-get($t, background-color), map-get($t, mute-percent)), + muted-color-border: mix(map-get($t, medium-color), map-get($t, background-color), semi-mute-percent(map-get($t, mute-percent))), text-selection-bg-color: rgba(map-get($t, action-color), 0.3), text-selection-bg-color-error: rgba(map-get($t, error-color), 0.8), text-semi-muted-color: mix(map-get($t, action-color), map-get($t, text-color), 0.5), - text-contrast-action-color: - text-contrast-color( - map-get($t, action-color), - map-get($t, color-lightness-shift), - map-get($t, background-color), - map-get($t, text-color) - ), - text-contrast-error-color: - text-contrast-color( - map-get($t, error-color), - map-get($t, color-lightness-shift), - map-get($t, background-color), - map-get($t, text-color) - ), + text-contrast-action-color: text-contrast-color(map-get($t, action-color), map-get($t, color-lightness-shift), map-get($t, background-color), map-get($t, text-color)), + text-contrast-error-color: text-contrast-color(map-get($t, error-color), map-get($t, color-lightness-shift), map-get($t, background-color), map-get($t, text-color)), base-border-color: mix(map-get($t, medium-color), map-get($t, background-color), 50%), accent-border-color: mix(map-get($t, medium-color), map-get($t, background-color), 65%), - light-border-color: - mix( - map-get($t, medium-color), - map-get($t, background-color), - map-get($t, light-border-percent) - ), + light-border-color: mix(map-get($t, medium-color), map-get($t, background-color), map-get($t, light-border-percent)), form-box-border-focus: map-get($t, action-color), form-box-shadow-color-focus: lightness-alpha(map-get($t, action-color), -5%, -0.3), form-box-shadow-color-focus-error: lightness-alpha(map-get($t, error-color), -5%, -0.3), dropdown-box-shadow-color: rgba(map-get($t, medium-color), 0.05), - secondary-background-color: - mix(map-get($t, medium-color), map-get($t, background-color), 10%), - intermediate-background-color: - mix(map-get($t, medium-color), map-get($t, background-color), 3%), - intermediate-pressed-background-color: - mix(map-get($t, medium-color), map-get($t, background-color), 2.6%), + secondary-background-color: mix(map-get($t, medium-color), map-get($t, background-color), 10%), + intermediate-background-color: mix(map-get($t, medium-color), map-get($t, background-color), 3%), + intermediate-pressed-background-color: mix(map-get($t, medium-color), map-get($t, background-color), 2.6%), disabled-background-color: shade(map-get($t, background-color), 5%), action-background-color-focus: shade(map-get($t, action-color), 20%), action-background-color-focus-tr: rgba(shade(map-get($t, action-color), 20%), 0.1), diff --git a/release-notes.md b/release-notes.md index 24b44a15..40fae726 100644 --- a/release-notes.md +++ b/release-notes.md @@ -1,5 +1,8 @@ Release notes ------------- +##### v1.13.4 (2020-04-15) +`-` fix #1457: fixed styles in theme plugins + ##### v1.13.3 (2020-04-11) `-` fix #1451: fixed slow global auto-type on desktop