thainv-dev: UI

components/dynamic-page/page-component/templates/sections/index.vue

@@ -10,9 +10,9 @@ const _props = defineProps<{
 const definedDynamicComponent: Record<string, any> = {
   'TYPE:Article-LAYOUT:horizontal-DATA:HORIZONTAL': Article_Pagination
 };
-console.log('đã vào')
+
 const getCurrentComponent = computed(() => `${_props.settings.layout}`);
-console.log(getCurrentComponent.value, 'getcomponent')
+
 const GET_PROPS = computed(() => {
   return () => {
     let props: any = {};

components/dynamic-page/page-component/templates/sections/layouts/Article.vue

@@ -110,9 +110,6 @@ watch(
             />
           </template>
         </template>
-        <template v-else>
-          <div class="empty"><h6 class="px-2 text-center">Nội dung danh sách bài viết của danh mục sẽ ở đây</h6></div>
-        </template>
         <div class="button-page flex">
           <a class="btn-page prev-page cursor-pointer" >
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" class="w-7 h-6 text-primary-600">
@@ -141,25 +138,22 @@ watch(
 .section-container {
   .collection-container {
     display: grid;
-    gap: 10px;
+    /* gap: 10px; */
+    overflow-x: scroll;
     &.border-custom {
       border-color: #e5e5e5 !important;
     }
     &.borderLeft {
       border-left: 1px solid;
-      padding-left: 16px;
     }
     &.borderRight {
       border-right: 1px solid;
-      padding-right: 16px;
     }
     &.borderTop {
       border-top: 1px solid;
-      padding-top: 16px;
     }
     &.borderBottom {
       border-bottom: 1px solid;
-      padding-bottom: 16px;
     }
     &.vertical {
       grid-template-columns: repeat(1, minmax(0, 1fr));
@@ -168,30 +162,8 @@ watch(
       grid-template-rows: auto;
       grid-auto-flow: column;
     }
-    &.borderRight ,
-  &.borderLeft, 
-  &.borderTop, 
-  &.borderBottom {
+  }
 
-    @media (max-width: 640px) {
-        border: 0;
-        padding: 0;
-      }
-  }
-  }
-  .empty {
-    width: 100%;
-    height: 100%;
-    min-height: 50px;
-    background-color: #409eff;
-    display: flex;
-    white-space: normal;
-    justify-content: center;
-    align-items: center;
-    h6 {
-      color: #fff;
-    }
-  }
   .basic-article {
     &.article {
       margin-bottom: 10px;
@@ -229,7 +201,4 @@ watch(
     align-items: center;
   }
 }
-.el-empty {
-  padding: 12px 0;
-}
 </style>