[S] Separate card class

src/components/Post.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="post" :class="{'service': p.type === 'service'}">
+    <div class="post card" :class="{'service': p.type === 'service'}">
         <div class="reply" v-if="p.reply">
             <img class="thumb" v-if="p.reply.thumb" :src="p.reply.thumb" alt="">
             <div class="mtext"><span>{{p.reply.text}}</span></div>
@@ -60,14 +60,6 @@ export default class PostView extends Vue
 
 .post
     width: 100%
-    background: #fdf9f1
-    border-radius: 20px
-    margin-bottom: 20px
-    padding: 12px 20px 8px
-    overflow: auto
-    overflow-x: hidden
-    box-sizing: border-box
-    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%)
 
     text-align: left
 

src/css/global.sass

@@ -153,3 +153,14 @@ html
 
 .vc-hue-slider__bar
   background: linear-gradient(to right, red 0%, yellow 16.66%, lime 33.33%, aqua 50%,blue 66.66%,fuchsia 83.33%,red 100%)
+
+
+.card
+  background: #fdf9f1
+  border-radius: 20px
+  margin-bottom: 20px
+  padding: 12px 20px 8px
+  overflow: auto
+  overflow-x: hidden
+  box-sizing: border-box
+  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%)