diff options
| -rw-r--r-- | src/components/style_switcher/style_switcher.js | 27 | ||||
| -rw-r--r-- | src/components/style_switcher/style_switcher.vue | 7 | ||||
| -rw-r--r-- | src/i18n/en.json | 1 | ||||
| -rw-r--r-- | src/services/style_setter/style_setter.js | 8 |
4 files changed, 36 insertions, 7 deletions
diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js index 33be522b..e1a17837 100644 --- a/src/components/style_switcher/style_switcher.js +++ b/src/components/style_switcher/style_switcher.js @@ -28,6 +28,7 @@ export default { invalidThemeImported: false, keepShadows: false, + keepOpacity: false, keepRoundness: false, textColorLocal: '', @@ -386,6 +387,14 @@ export default { }) }, + clearOpacity () { + Object.keys(this.$data) + .filter(_ => _.endsWith('OpacityLocal')) + .forEach(key => { + set(this.$data, key, undefined) + }) + }, + clearShadows () { this.shadowsLocal = {} console.log(this.shadowsLocal) @@ -397,9 +406,10 @@ export default { * @param {Number} version - version of data. 0 means try to guess based on data. */ normalizeLocalState (input, version = 0) { + console.log(input.opacity) const colors = input.colors || input const radii = input.radii || input - const opacity = input.opacity || input + const opacity = input.opacity const shadows = input.shadows || {} if (version === 0) { @@ -451,10 +461,13 @@ export default { this.shadowSelected = this.shadowsAvailable[0] } - Object.entries(opacity).forEach(([k, v]) => { - if (typeof v === 'undefined' || v === null || Number.isNaN(v)) return - this[k + 'OpacityLocal'] = v - }) + if (opacity && !this.keepOpacity) { + this.clearOpacity() + Object.entries(opacity).forEach(([k, v]) => { + if (typeof v === 'undefined' || v === null || Number.isNaN(v)) return + this[k + 'OpacityLocal'] = v + }) + } } }, watch: { @@ -468,6 +481,10 @@ export default { this.clearShadows() } + if (!this.keepOpacity) { + this.clearOpacity() + } + this.clearV1() this.bgColorLocal = this.selected[1] diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue index 0c6b811d..ed0dd733 100644 --- a/src/components/style_switcher/style_switcher.vue +++ b/src/components/style_switcher/style_switcher.vue @@ -34,6 +34,13 @@ </span> <span> <input + id="keep-opacity" + type="checkbox" + v-model="keepOpacity"> + <label for="keep-opacity">{{$t('settings.style.switcher.keep_opacity')}}</label> + </span> + <span> + <input id="keep-roundness" type="checkbox" v-model="keepRoundness"> diff --git a/src/i18n/en.json b/src/i18n/en.json index a9d50dbe..98a91013 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -166,6 +166,7 @@ "style": { "switcher": { "keep_shadows": "Keep shadows", + "keep_opacity": "Keep opacity", "keep_roundness": "Keep roundness", "save_load_hint": "\"Keep\" options preserve currently set options when selecting or loading themes, it also stores said options when exporting a theme." }, diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js index d7487eed..60531f28 100644 --- a/src/services/style_setter/style_setter.js +++ b/src/services/style_setter/style_setter.js @@ -94,7 +94,10 @@ const setColors = (input, commit) => { } const getCssShadow = (input) => { - // >shad + if (input.length === 0) { + return 'none' + } + return input.map((shad) => [ shad.x, shad.y, @@ -340,9 +343,10 @@ const generateShadows = (input) => { ...(input.shadows || {}) } + console.log(Object.entries(shadows).map(([k, v]) => `--${k}Shadow: ${getCssShadow(v)}`).join(';')) return { rules: { - shadows: Object.entries(shadows).filter(([k, v]) => v).map(([k, v]) => `--${k}Shadow: ${getCssShadow(v)}`).join(';') + shadows: Object.entries(shadows).map(([k, v]) => `--${k}Shadow: ${getCssShadow(v)}`).join(';') }, theme: { shadows |