minhnt-dev: make UI

components/dynamic-page/page-component/templates/articles/collections/BasicCollection.vue

@@ -37,7 +37,7 @@ const _dataResult = computed(() => {
 
 <template>
   <div>
-    <div class="collection-container p-2" :class="LAYOUT_PARSE['LAYOUT'] || 'horizontal'">
+    <div class="collection-container grid gap-5" :class="LAYOUT_PARSE['LAYOUT'] || 'horizontal'">
       <div v-for="(component, index) in _dataResult" :key="index">
         <template v-if="!isEmpty(component)">
           <DynamicComponent
@@ -65,8 +65,6 @@ const _dataResult = computed(() => {
 
 <style lang="scss" scoped>
 .collection-container {
-  display: grid;
-  gap: 10px;
   &.vertical {
     grid-template-columns: repeat(1, minmax(0, 1fr));
   }
@@ -74,13 +72,5 @@ const _dataResult = computed(() => {
     grid-template-rows: auto;
     grid-auto-flow: column;
   }
-  .empty {
-    min-height: 100px;
-    border-radius: 6px;
-    background: #409eff;
-  }
-  &.noData {
-    border-radius: 6px;
-  }
 }
 </style>