thainv-dev: tạo lại cấu trúc folder và làm UI

2024-06-12 17:17:49 +07:00
parent c217ed82c9
commit 5b1e0af397
44 changed files with 2674 additions and 228 deletions
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+
+
+const props = defineProps<{
+  dataResult?: any;
+  dataType?: any;
+  dataQuery?: any;
+  layout?: string;
+  design?: string;
+}>();
+
+</script>
+
+<template>
+  <div>
+  vào r</div>
+</template>
+
+<style lang="scss" scoped>
+.basic-article {
+  display: grid;
+  gap: 10px;
+  height: 100%;
+
+  &.no-data {
+    gap: 5px !important;
+  }
+
+  &.vertical {
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+  }
+  &.border-custom {
+    border-color: #e5e5e5 !important;
+  }
+  &.borderLeft {
+    border-left: 2px solid;
+    padding-left: 10px;
+  }
+  &.borderRight {
+    border-right: 2px solid;
+    padding-right: 10px;
+  }
+  &.borderTop {
+    border-top: 2px solid;
+    padding-top: 10px;
+  }
+  &.borderBottom {
+    border-bottom: 2px solid;
+    padding-bottom: 10px;
+  }
+  &.horizontal {
+    grid-template-columns: 1fr 1fr;
+
+    &.reverse {
+      .basic-article_thumbnail {
+        grid-column: 2;
+      }
+
+      .basic-article_content {
+        grid-row: 1;
+      }
+    }
+  }
+
+  &_thumbnail {
+    flex: 1;
+
+    img {
+      width: 100%;
+      border-radius: 6px;
+      aspect-ratio: 16/10;
+    }
+  }
+
+  &_content {
+    padding: 10px 0px;
+
+    &.no-data {
+      padding: 0px;
+    }
+
+    h3 {
+      font-size: 15px;
+    }
+
+    p {
+      font-size: 12px;
+      margin-top: 10px;
+    }
+  }
+
+  .empty-block {
+    background-color: #409eff;
+    height: 100px;
+    display: block;
+  }
+}
+</style>