added "keep opacity" option, fixed opacity loading, fixed missing shadows not

affecting the preview (i.e. previewing pleroma-dark when redmond is applied)

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,11 +461,14 @@ export default {
         this.shadowSelected = this.shadowsAvailable[0]
       }
 
+      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: {
     selected () {
@@ -468,6 +481,10 @@ export default {
           this.clearShadows()
         }
 
+        if (!this.keepOpacity) {
+          this.clearOpacity()
+        }
+
         this.clearV1()
 
         this.bgColorLocal = this.selected[1]

src/components/style_switcher/style_switcher.vue

@@ -32,6 +32,13 @@
           v-model="keepShadows">
         <label for="keep-shadows">{{$t('settings.style.switcher.keep_shadows')}}</label>
       </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"

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."
       },

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