Merge branch 'feature/20251126_jo_bugfix' into 'feature/202501107-all'
feat: 디자인QA 개선 및 버그 수정 See merge request sgp-web-d/web-template-fe!10
This commit is contained in:
@@ -626,7 +626,7 @@ body .date-picker-menu-wrap .dp__calendar_item {
|
||||
padding: 2px 4px !important;
|
||||
}
|
||||
body .date-picker-menu-wrap .dp__cell_inner {
|
||||
padding: 8px !important;
|
||||
padding: 0px !important;
|
||||
border-radius: 100% !important;
|
||||
outline: none !important;
|
||||
border: none !important;
|
||||
|
||||
@@ -521,10 +521,6 @@ onMounted(async () => {
|
||||
@click="handleCouponUse"
|
||||
>
|
||||
<span>{{ tm('Coupon_Registration') }}</span>
|
||||
<AtomsIconsCouponFill
|
||||
:size="breakpoints.isMobile ? 16 : 20"
|
||||
color="#FFFFFF"
|
||||
/>
|
||||
</AtomsButton>
|
||||
</div>
|
||||
|
||||
@@ -804,7 +800,7 @@ onMounted(async () => {
|
||||
<style scoped>
|
||||
/* Button Style */
|
||||
.btn-period {
|
||||
@apply border border-solid border-[#D9D9D9] rounded-[0] w-auto h-[40px] px-[16px] before:content-none after:content-none
|
||||
@apply border border-solid border-[#D9D9D9] rounded-[0] w-auto h-[40px] px-[16px] font-[700] before:content-none after:content-none
|
||||
transition-all duration-300 ease-in-out
|
||||
hover:z-[4] hover:!bg-[#FFFFFF] hover:border-[#404040] hover:!text-[#1F1F1F];
|
||||
}
|
||||
|
||||
@@ -164,7 +164,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
|
||||
</span>
|
||||
|
||||
<h4
|
||||
class="relative flex justify-left items-center w-full gap-[4px] text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[0.72px]"
|
||||
class="relative flex justify-left items-center w-full gap-[4px] text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[-0.72px]"
|
||||
>
|
||||
<span>{{ tm('Download_Box_PC_Title') }}</span>
|
||||
|
||||
@@ -299,10 +299,13 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
|
||||
<section ref="specPCRef" class="section-static">
|
||||
<WidgetsFixSubTitle :title="tm('Download_Section_PC_Title')" />
|
||||
|
||||
<div
|
||||
class="relative w-full border border-solid border-[#D9D9D9] rounded-[12px] overflow-hidden md:rounded-[16px]"
|
||||
>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="w-[80px] md:w-[172px]">
|
||||
<th class="w-[80px] md:w-[172px] !border-l-[0]">
|
||||
{{ tm('Download_Table_Item') }}
|
||||
</th>
|
||||
<th>{{ tm('Download_Table_Min_Spec') }}</th>
|
||||
@@ -310,16 +313,30 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<template v-for="tr in pcSpecList" :key="tr.id">
|
||||
<template v-for="(tr, trIdx) in pcSpecList" :key="tr.id">
|
||||
<tr>
|
||||
<th class="w-[80px] md:w-[172px]">{{ tr.itemText }}</th>
|
||||
<th
|
||||
:class="[
|
||||
'w-[80px] md:w-[172px] !border-l-[0]',
|
||||
trIdx === pcSpecList.length - 1 ? '!border-b-[0]' : '',
|
||||
]"
|
||||
>
|
||||
{{ tr.itemText }}
|
||||
</th>
|
||||
<template v-for="td in tr.itemData" :key="td.display.text">
|
||||
<td>{{ td.display.text }}</td>
|
||||
<td
|
||||
:class="
|
||||
trIdx === pcSpecList.length - 1 ? '!border-b-[0]' : ''
|
||||
"
|
||||
>
|
||||
{{ td.display.text }}
|
||||
</td>
|
||||
</template>
|
||||
</tr>
|
||||
</template>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="!breakpoints.isMobile"
|
||||
@@ -420,10 +437,13 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
|
||||
|
||||
<section ref="specMobileRef" class="section-static">
|
||||
<WidgetsFixSubTitle :title="tm('Download_Section_MOBILE_Title')" />
|
||||
<div
|
||||
class="relative w-full border border-solid border-[#D9D9D9] rounded-[12px] overflow-hidden md:rounded-[16px]"
|
||||
>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th rowspan="2" class="w-[80px] md:w-[172px]">
|
||||
<th rowspan="2" class="w-[80px] md:w-[172px] !border-l-[0]">
|
||||
{{ tm('Download_Table_Item') }}
|
||||
</th>
|
||||
<th colspan="2">{{ tm('Download_Table_Min_Spec') }}</th>
|
||||
@@ -437,16 +457,30 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<template v-for="tr in mobileSpecList" :key="tr.id">
|
||||
<template v-for="(tr, trIdx) in mobileSpecList" :key="tr.id">
|
||||
<tr>
|
||||
<th class="w-[80px] md:w-[172px]">{{ tr.itemText }}</th>
|
||||
<th
|
||||
:class="[
|
||||
'w-[80px] md:w-[172px] !border-l-[0]',
|
||||
trIdx === mobileSpecList.length - 1 ? '!border-b-[0]' : '',
|
||||
]"
|
||||
>
|
||||
{{ tr.itemText }}
|
||||
</th>
|
||||
<template v-for="td in tr.itemData" :key="td.display.text">
|
||||
<td>{{ td.display.text }}</td>
|
||||
<td
|
||||
:class="
|
||||
trIdx === mobileSpecList.length - 1 ? '!border-b-[0]' : ''
|
||||
"
|
||||
>
|
||||
{{ td.display.text }}
|
||||
</td>
|
||||
</template>
|
||||
</tr>
|
||||
</template>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
@@ -457,11 +491,11 @@ table {
|
||||
@apply w-full h-auto border-collapse border-spacing-0 table-fixed;
|
||||
}
|
||||
table th {
|
||||
@apply py-[8px] px-[12px] border border-[#D9D9D9] bg-[#FAFAFA] text-[#1F1F1F] text-[14px] font-bold leading-[24px] tracking-[-0.42px]
|
||||
@apply py-[8px] px-[12px] border-l border-b border-solid border-[#D9D9D9] bg-[#FAFAFA] text-center text-[#1F1F1F] text-[14px] font-bold leading-[24px] tracking-[-0.42px]
|
||||
md:py-[11px] md:px-[20px] md:text-[16px] md:leading-[26px] md:tracking-[-0.48px];
|
||||
}
|
||||
table td {
|
||||
@apply h-[64px] py-[8px] px-[12px] border border-[#D9D9D9] bg-[#FFFFFF] text-[#666666] text-[14px] font-[400] leading-[24px] tracking-[-0.42px]
|
||||
@apply h-[64px] py-[8px] px-[12px] border-l border-b border-[#D9D9D9] bg-[#FFFFFF] text-center text-[#666666] text-[14px] font-[400] leading-[24px] tracking-[-0.42px]
|
||||
md:h-[80px] md:py-[14px] md:px-[20px] md:text-[16px] md:leading-[26px] md:tracking-[-0.48px];
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user