minhnt-dev: make UI

components/dynamic-page/page-section/templates/articles/Default.vue

@@ -14,8 +14,8 @@ const props = defineProps<{
 
 <template>
     <section class="section-container">
-        <h2 class="section__title mb-3" v-if="props.label">{{ props.label || '' }}</h2>
-        <div class="section_layout">
+        <h2 class="text-4xl mb-3 font-600" v-if="props.label">{{ props.label || '' }}</h2>
+        <div class="layout_define grid grid-cols-1 gap-x-10 gap-y-2.5">
             <template v-if="props.layout">
                 <DynamicLayout
                     :layout="props.layout"
@@ -24,25 +24,6 @@ const props = defineProps<{
                     :section= "props.section"
                 />
             </template>
-            <template v-else>
-                <div>
-                    Bấm để chọn layout
-                </div>
-            </template>
         </div>
     </section>
 </template>
-
-<style lang="scss" scoped>
-.section_layout {
-    display: grid;
-    grid-template-columns: repeat(1, minmax(0, 1fr)); 
-    gap: 10px;     
-
-    .empty {
-        min-height: 100px;
-        border-radius: 6px;
-        background: #409eff;
-    }
-}
-</style>