fix(cms): picture grid is displayed incorrectly (#814)

packages/default-theme/cms/blocks/CmsBlockImageSimpleGrid.vue

@@ -1,10 +1,19 @@
 <template>
  <article class="sw-image-simple-grid">
  <section class="sw-image-simple-grid__left-images">
- <CmsGenericElement :content="getLeftTopContent" class="sw-image-simple-grid__image"/>
- <CmsGenericElement :content="getLeftBottomContent" class="sw-image-simple-grid__image"/>
+ <CmsGenericElement
+ :content="getLeftTopContent"
+ class="sw-image-simple-grid__image"
+ />
+ <CmsGenericElement
+ :content="getLeftBottomContent"
+ class="sw-image-simple-grid__image"
+ />
  </section>
- <CmsGenericElement :content="getRightContent" class="sw-image-simple-grid__image sw-image-simple-grid__image--right"/>
+ <CmsGenericElement
+ :content="getRightContent"
+ class="sw-image-simple-grid__image sw-image-simple-grid__image--right"
+ />
  </article>
 </template>
 
@@ -14,35 +23,35 @@ import CmsGenericElement from 'sw-cms/CmsGenericElement'
 export default {
  name: 'CmsBlockImageSimpleGrid',
  components: {
- CmsGenericElement
+ CmsGenericElement,
  },
  props: {
  content: {
  type: Object,
- default: () => ({})
- }
+ default: () => ({}),
+ },
  },
  computed: {
  getSlots() {
  return this.content.slots || []
  },
  getLeftTopContent() {
- return this.getSlots.find(({slot}) => slot === 'left-top')
+ return this.getSlots.find(({ slot }) => slot === 'left-top')
  },
  getLeftBottomContent() {
- return this.getSlots.find(({slot}) => slot === 'left-bottom')
+ return this.getSlots.find(({ slot }) => slot === 'left-bottom')
  },
  getRightContent() {
- return this.getSlots.find(({slot}) => slot === 'right')
+ return this.getSlots.find(({ slot }) => slot === 'right')
  },
  },
-};
+}
 </script>
 
 <style lang="scss" scoped>
 @import '@/assets/scss/variables';
 
-.sw-image-simple-grid {
+::v-deep.sw-image-simple-grid {
  display: flex;
  flex-direction: column;
 
@@ -61,7 +70,7 @@ export default {
  justify-content: space-around;
  align-items: center;
  flex-direction: row;
- 
+
  &__left-images {
  display: flex;
  flex-direction: column;
@@ -75,5 +84,4 @@ export default {
  }
  }
 }
-
 </style>