minhnt-dev: make UI
This commit is contained in:
@@ -141,7 +141,7 @@ const CLASS_FOR_SECTION = computed(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="section_layout" :class="[CLASS_FOR_SECTION.section_layout]">
|
||||
<div class="section_layout grid gap-x-5 gap-y-2.5" :class="[CLASS_FOR_SECTION.section_layout]">
|
||||
<div
|
||||
v-for="(position, index) in props.content || Array(SETTING_OPTIONS.MAX_ELEMENT).fill({})"
|
||||
:key="index"
|
||||
@@ -154,9 +154,6 @@ const CLASS_FOR_SECTION = computed(() => {
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.section_layout {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
|
||||
&.basic_column {
|
||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
Reference in New Issue
Block a user