added checkboxes to keep current roundness and shadows, also cleaned up how

shadows/roundness are reset when switching themes

src/components/style_switcher/style_switcher.js

@@ -27,6 +27,9 @@ export default {
       selected: this.$store.state.config.theme,
       invalidThemeImported: false,
 
+      keepShadows: false,
+      keepRoundness: false,
+
       textColorLocal: '',
       linkColorLocal: '',
 
@@ -375,6 +378,19 @@ export default {
         })
     },
 
+    clearRoundness () {
+      Object.keys(this.$data)
+        .filter(_ => _.endsWith('RadiusLocal'))
+        .forEach(key => {
+          set(this.$data, key, undefined)
+        })
+    },
+
+    clearShadows () {
+      this.shadowsLocal = {}
+      console.log(this.shadowsLocal)
+    },
+
     /**
      * This applies stored theme data onto form.
      * @param {Object} input - input data
@@ -420,6 +436,8 @@ export default {
         this[key + 'ColorLocal'] = rgb2hex(colors[key])
       })
 
+      if (!this.keepRoundness) {
+        this.clearRoundness()
         // TODO optimize this
         this.btnRadiusLocal = radii.btn
         this.inputRadiusLocal = radii.input
@@ -429,8 +447,13 @@ export default {
         this.avatarAltRadiusLocal = radii.avatarAlt
         this.tooltipRadiusLocal = radii.tooltip
         this.attachmentRadiusLocal = radii.attachment
+      }
 
+      if (!this.keepShadows) {
+        this.clearShadows()
         this.shadowsLocal = shadows
+        this.shadowSelected = this.shadowsAvailable[0]
+      }
 
       Object.entries(opacity).forEach(([k, v]) => {
         if (typeof v === 'undefined' || v === null || Number.isNaN(v)) return
@@ -441,7 +464,16 @@ export default {
   watch: {
     selected () {
       if (this.selectedVersion === 1) {
+        if (!this.keepRoundness) {
+          this.clearRoundness()
+        }
+
+        if (!this.keepShadows) {
+          this.clearShadows()
+        }
+
         this.clearV1()
+
         this.bgColorLocal = this.selected[1]
         this.fgColorLocal = this.selected[2]
         this.textColorLocal = this.selected[3]

src/components/style_switcher/style_switcher.scss

@@ -66,7 +66,7 @@
   .apply-container,
   .radius-container,
   .color-container,
-  .presets-container {
+  {
     display: flex;
 
     p {
@@ -88,12 +88,14 @@
 
   .color-container,
   .shadow-container,
-  .radius-container {
+  .radius-container,
+  .presets-container {
     margin: 1em 1em 0;
   }
 
-  .presets-container,
+  .shadow-selector,
-  .shadow-selector {
+  .save-load,
+  .save-load-options {
     display: flex;
     justify-content: center;
     align-items: baseline;
@@ -110,6 +112,14 @@
     }
   }
 
+  .save-load-options {
+    flex-wrap: wrap;
+    margin-top: .5em;
+    span {
+      margin: 0 .5em;
+    }
+  }
+
   .preview-container {
     border-top: 1px dashed;
     border-bottom: 1px dashed;

src/components/style_switcher/style_switcher.vue

@@ -1,6 +1,7 @@
 <template>
 <div class="style-switcher">
   <div class="presets-container">
+    <div class="save-load">
       <div>
         {{$t('settings.presets')}}
         <label for="preset-switcher" class='select'>
@@ -23,6 +24,24 @@
         <p v-if="invalidThemeImported" class="import-warning">{{ $t('settings.invalid_theme_imported') }}</p>
       </div>
     </div>
+    <div class="save-load-options">
+      <span>
+        <input
+          id="keep-shadows"
+          type="checkbox"
+          v-model="keepShadows">
+        <label for="keep-shadows">{{$t('settings.style.switcher.keep_shadows')}}</label>
+      </span>
+      <span>
+        <input
+          id="keep-roundness"
+          type="checkbox"
+          v-model="keepRoundness">
+        <label for="keep-roundness">{{$t('settings.style.switcher.keep_roundness')}}</label>
+      </span>
+      <p>{{$t('settings.style.switcher.save_load_hint')}}</p>
+    </div>
+  </div>
 
   <div class="preview-container">
     <div class="panel dummy" :style="previewRules">

src/i18n/en.json

@@ -164,6 +164,11 @@
       "true": "yes"
     },
     "style": {
+      "switcher": {
+        "keep_shadows": "Keep shadows",
+        "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."
+      },
       "common": {
         "color": "Color",
         "opacity": "Opacity",