Merge branch 'fix-preview-interference' into 'develop'

fix theme preview styles being applied to post preview

See merge request pleroma/pleroma-fe!1926

4 files changed, 12 insertions, 11 deletions

diff --git a/changelog.d/preview-interference.skip b/changelog.d/preview-interference.skip
new file mode 100644
index 00000000..e32e76dd
--- /dev/null
+++ b/changelog.d/preview-interference.skip
@@ -0,0 +1 @@
+skip
diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index 98d38288..b5fd6c4c 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -25,7 +25,7 @@ import {
   faGlobe
 } from '@fortawesome/free-solid-svg-icons'
 
-import Preview from './theme_tab/preview.vue'
+import Preview from './theme_tab/theme_preview.vue'
 
 library.add(
   faGlobe
diff --git a/src/components/settings_modal/tabs/theme_tab/preview.vue b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
index 3fb0558b..dbaecee4 100644
--- a/src/components/settings_modal/tabs/theme_tab/preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="preview-container">
+  <div class="theme-preview-container">
     <div class="underlay underlay-preview" />
     <div class="panel dummy">
       <div class="panel-heading">
@@ -136,7 +136,7 @@ export default {
 </script>
 
 <style lang="scss">
-.preview-container {
+.theme-preview-container {
   position: relative;
   border-top: 1px dashed;
   border-bottom: 1px dashed;
@@ -238,13 +238,13 @@ export default {
       min-width: 3em;
     }
   }
-}
 
-.underlay-preview {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 10px;
-  right: 10px;
+  .underlay-preview {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 10px;
+    right: 10px;
+  }
 }
  </style>
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
index 39dc372e..25836559 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
@@ -45,7 +45,7 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Select from 'src/components/select/select.vue'
 
-import Preview from './preview.vue'
+import Preview from './theme_preview.vue'
 
 // List of color values used in v1
 const v1OnlyNames = [