diff --git a/pages/module/discovery/DiscoveryCardComponent.vue b/pages/module/discovery/DiscoveryCardComponent.vue index 6f0ad06..30edc9d 100644 --- a/pages/module/discovery/DiscoveryCardComponent.vue +++ b/pages/module/discovery/DiscoveryCardComponent.vue @@ -34,9 +34,5 @@ onMounted(() => { diff --git a/pages/module/discovery/DiscoveryCradContentList.vue b/pages/module/discovery/DiscoveryCradContentList.vue index cc7d641..f96cff4 100644 --- a/pages/module/discovery/DiscoveryCradContentList.vue +++ b/pages/module/discovery/DiscoveryCradContentList.vue @@ -7,8 +7,14 @@ :key="index" > - - {{ item.topic }} + + + + {{ item.topic }} @@ -16,9 +22,12 @@ diff --git a/pages/module/discovery/styles/DiscoveryCardComponent.scss b/pages/module/discovery/styles/DiscoveryCardComponent.scss new file mode 100644 index 0000000..9da07fd --- /dev/null +++ b/pages/module/discovery/styles/DiscoveryCardComponent.scss @@ -0,0 +1,5 @@ +.container { + width: 100%; + flex: 1; + margin-bottom: 12px; +} diff --git a/pages/module/discovery/styles/DiscoveryCradContentList.scss b/pages/module/discovery/styles/DiscoveryCradContentList.scss new file mode 100644 index 0000000..16723f6 --- /dev/null +++ b/pages/module/discovery/styles/DiscoveryCradContentList.scss @@ -0,0 +1,33 @@ +.container { + .container-scroll { + display: flex; + flex-direction: row; + overflow-x: auto; + margin-top: 4px; + + .mk-card-item { + display: flex; + flex-direction: column; + align-items: start; + width: 188px; + height: 154px; + background-color: #ffffff; + border-radius: 10px; + margin-right: 8px; + position: relative; + + .card-img { + width: 188px; + height: 112px; + } + + .card-text { + padding: 12px; + text-align: center; + font-weight: 500; + font-size: 12px; + color: #333333; + } + } + } +}