fix. 디자인 가이드 수정
This commit is contained in:
@@ -16,10 +16,10 @@
|
||||
|
||||
/* Title Utility Classes */
|
||||
.title-lg {
|
||||
@apply line-clamp-3 text-[24px] font-[700] leading-[34px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:text-[50px] md:leading-[70px];
|
||||
@apply line-clamp-4 text-[24px] font-[700] leading-[34px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-3 md:text-[50px] md:leading-[70px];
|
||||
}
|
||||
.title-md {
|
||||
@apply line-clamp-2 text-[20px] font-[700] leading-[30px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-1 md:text-[42px] md:leading-[56px];
|
||||
@apply line-clamp-4 text-[20px] font-[700] leading-[30px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-3 md:text-[42px] md:leading-[56px];
|
||||
}
|
||||
.title-sm {
|
||||
@apply line-clamp-2 text-[16px] font-[500] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-1 md:text-[24px] md:leading-[34px];
|
||||
@@ -29,6 +29,6 @@
|
||||
|
||||
/* Description Utility Classes */
|
||||
.description-lg {
|
||||
@apply line-clamp-3 text-[15px] font-[400] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:text-[20px] md:leading-[30px];
|
||||
@apply line-clamp-4 text-[15px] font-[400] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-3 md:text-[20px] md:leading-[30px];
|
||||
}
|
||||
}
|
||||
|
||||
@@ -144,7 +144,7 @@ onBeforeUnmount(() => {
|
||||
@apply h-full;
|
||||
}
|
||||
.thumbnail-carousel.thumbnail-default .thumbnail-splide {
|
||||
@apply absolute bottom-[32px] left-1/2 -translate-x-1/2 md:bottom-[48px] md:px-[72px];
|
||||
@apply absolute bottom-[32px] left-1/2 -translate-x-1/2 max-w-[100%] md:bottom-[48px] md:max-w-[896px] md:px-[72px];
|
||||
}
|
||||
.thumbnail-carousel.thumbnail-default:deep(.arrow-prev) {
|
||||
@apply left-0;
|
||||
|
||||
@@ -6,6 +6,7 @@ import GrGallery02 from '#layers/templates/GrGallery02/index.vue'
|
||||
import GrGallery03 from '#layers/templates/GrGallery03/index.vue'
|
||||
import GrDetail01 from '#layers/templates/GrDetail01/index.vue'
|
||||
import GrDetail02 from '#layers/templates/GrDetail02/index.vue'
|
||||
import GrDetail03 from '#layers/templates/GrDetail03/index.vue'
|
||||
|
||||
const templateRegistry = {
|
||||
GR_VISUAL_01: { component: GrVisual01 },
|
||||
@@ -17,7 +18,7 @@ const templateRegistry = {
|
||||
// GR_BOARD_01: { component: GrBoard01 },
|
||||
GR_DETAIL_01: { component: GrDetail01 },
|
||||
GR_DETAIL_02: { component: GrDetail02 },
|
||||
// GR_DETAIL_03: { component: GrDetail03 },
|
||||
GR_DETAIL_03: { component: GrDetail03 },
|
||||
// GR_CONTENTS_01: { component: GrContents01 },
|
||||
} as const
|
||||
|
||||
|
||||
@@ -63,7 +63,7 @@ onMounted(() => {
|
||||
<WidgetsSubTitle
|
||||
v-if="hasComponentGroup(item, 'subTitle')"
|
||||
:resources-data="getComponentGroup(item, 'subTitle')"
|
||||
class="title-sm mt-0.5 md:mt-1"
|
||||
class="title-sm mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
|
||||
/>
|
||||
<WidgetsDescription
|
||||
v-if="hasComponentGroup(item, 'description')"
|
||||
@@ -91,7 +91,7 @@ onMounted(() => {
|
||||
>
|
||||
<span class="item-bullet"></span>
|
||||
<span class="item-title">
|
||||
{{ getComponentGroup(item, 'naviTitle')?.display?.text || '' }}
|
||||
{{ getComponentGroup(item, 'pagenaviTitle')?.display?.text || '' }}
|
||||
</span>
|
||||
</button>
|
||||
<div v-if="index !== slideData.length - 1" class="progress-bar">
|
||||
|
||||
@@ -31,7 +31,7 @@ const slideData = computed(() => {
|
||||
<WidgetsSubTitle
|
||||
v-if="hasComponentGroup(item, 'subTitle')"
|
||||
:resources-data="getComponentGroup(item, 'subTitle')"
|
||||
class="title-sm mt-0.5 md:mt-1"
|
||||
class="title-sm mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
|
||||
/>
|
||||
<WidgetsDescription
|
||||
v-if="hasComponentGroup(item, 'description')"
|
||||
|
||||
@@ -23,7 +23,7 @@ const mainTitleData = computed(() =>
|
||||
const slideData = computed(() => {
|
||||
return ensureMinimumSlideData(props.components)
|
||||
})
|
||||
const subTitleData = ref(getComponentGroup(slideData?.value[0], 'imgTitle'))
|
||||
const imgTitleData = ref(getComponentGroup(slideData?.value[0], 'imgTitle'))
|
||||
const descriptionData = ref(
|
||||
getComponentGroup(slideData?.value[0], 'description')
|
||||
)
|
||||
@@ -50,7 +50,7 @@ const handleChange = (
|
||||
_oldIndex: number,
|
||||
_destIndex: number
|
||||
) => {
|
||||
subTitleData.value = getComponentGroup(slideData.value[newIndex], 'imgTitle')
|
||||
imgTitleData.value = getComponentGroup(slideData.value[newIndex], 'imgTitle')
|
||||
descriptionData.value = getComponentGroup(
|
||||
slideData.value[newIndex],
|
||||
'description'
|
||||
@@ -90,9 +90,9 @@ const handleChange = (
|
||||
</SplideSlide>
|
||||
</BlocksSlideCenterHighlight>
|
||||
<WidgetsSubTitle
|
||||
v-if="subTitleData"
|
||||
:resources-data="subTitleData"
|
||||
class="title-md mt-[32px]"
|
||||
v-if="imgTitleData"
|
||||
:resources-data="imgTitleData"
|
||||
class="title-md mt-[32px] line-clamp-2 md:line-clamp-1"
|
||||
/>
|
||||
<WidgetsDescription
|
||||
v-if="descriptionData"
|
||||
|
||||
Reference in New Issue
Block a user