gil/fod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

수정 중2

Browse Source
This commit is contained in:
hyeonggil
2025-07-30 22:11:36 +09:00
parent c7ec83eca6
commit f24a5a7f3f
5 changed files with 99 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
kr/assets/css/pdp_detail.css
View File

@@ -3940,6 +3940,7 @@
.displayThemeDesney .available-theme .list ul li a { .displayThemeDesney .available-theme .list ul li a {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
@@ -3987,13 +3988,30 @@
} }
.displayThemeDesney .available-theme .list ul li.more { .displayThemeDesney .available-theme .list ul li.more {
overflow: visible; overflow: visible;
position: relative;
width: 100%; width: 100%;
aspect-ratio: 320/194; aspect-ratio: 320/190;
padding: 6.6666666667vw 5.5555555556vw; padding: 6.6666666667vw 5.5555555556vw;
margin: 0; margin: 0;
background: url(../images/kia/pdp/display_theme_disney/box_more_m.png) no-repeat center/auto 100%; background-color: transparent;
border-radius: 7.2222222222vw 0.8rem 7.2222222222vw 0.8rem; border-radius: 0;
box-shadow: 0px 0px 1rem 0px rgba(0, 0, 0, 0.1215686275); box-shadow: none;
}
.displayThemeDesney .available-theme .list ul li.more:before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 94.4444444444vw;
height: 58.3333333333vw;
background: url(../images/kia/pdp/display_theme_disney/box_more_m2.png) no-repeat center/auto 100%;
}
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li.more:before {
display: none;
}
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li.more { .displayThemeDesney .available-theme .list ul li.more {

2
kr/assets/css/pdp_detail.css.map
View File

File diff suppressed because one or more lines are too long

111
kr/assets/css/pdp_detail.scss
View File

@@ -1563,7 +1563,7 @@
} }
} }
.btn-select.on + .list-member { .btn-select.on+.list-member {
display: block; display: block;
} }
@@ -1834,7 +1834,7 @@
font-size: 1.8rem; font-size: 1.8rem;
} }
> p { >p {
position: relative; position: relative;
width: 93%; width: 93%;
@@ -1910,7 +1910,7 @@
} }
} }
dt.active + dd { dt.active+dd {
display: block; display: block;
} }
@@ -2042,7 +2042,7 @@
} }
} }
button + button { button+button {
margin-top: 1rem; margin-top: 1rem;
@include tablet { @include tablet {
@@ -2054,7 +2054,7 @@
} }
} }
> .dd-padding { >.dd-padding {
padding-left: 6.5rem; padding-left: 6.5rem;
} }
} }
@@ -2075,10 +2075,9 @@
content: none; content: none;
} }
&:hover { &:hover {}
}
> p { >p {
span { span {
color: #9ea1a2; color: #9ea1a2;
} }
@@ -2086,7 +2085,7 @@
} }
} }
dl + dl { dl+dl {
margin-top: 1rem; margin-top: 1rem;
} }
} }
@@ -2306,6 +2305,7 @@
} }
@include maxtablet { @include maxtablet {
&:before, &:before,
&:after { &:after {
display: none; display: none;
@@ -2374,6 +2374,7 @@
// height: 10rem; // height: 10rem;
.comp_body { .comp_body {
.text_area { .text_area {
// display: flex; // display: flex;
h3 { h3 {
font-size: 3rem; font-size: 3rem;
@@ -2384,7 +2385,7 @@
font-size: 1.6rem; font-size: 1.6rem;
} }
> * { >* {
flex: 1; flex: 1;
} }
} }
@@ -2460,7 +2461,7 @@
} }
} }
& + .item { &+.item {
margin-top: 8rem; margin-top: 8rem;
@include maxtablet { @include maxtablet {
@@ -2474,7 +2475,7 @@
} }
} }
& + .comp_1x_b_v_s_b { &+.comp_1x_b_v_s_b {
position: relative; position: relative;
z-index: 2; z-index: 2;
margin-top: 0; margin-top: 0;
@@ -2500,7 +2501,7 @@
margin-top: 8rem; margin-top: 8rem;
.comp_body { .comp_body {
& + .comp_body { &+.comp_body {
margin-top: 10rem; margin-top: 10rem;
} }
@@ -2517,7 +2518,7 @@
.displayThemeDtl { .displayThemeDtl {
.swiper-navigation { .swiper-navigation {
> * { >* {
top: 210px; top: 210px;
left: -65px; left: -65px;
width: 5rem; width: 5rem;
@@ -2752,6 +2753,7 @@
} }
@include maxtablet { @include maxtablet {
&:before, &:before,
&:after { &:after {
display: none; display: none;
@@ -2822,12 +2824,13 @@
.comp_body { .comp_body {
.text_area { .text_area {
// display: flex; // display: flex;
h3 { h3 {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
> * { >* {
flex: 1; flex: 1;
} }
} }
@@ -2896,7 +2899,7 @@
} }
} }
& + .item { &+.item {
margin-top: 8rem; margin-top: 8rem;
@include maxtablet { @include maxtablet {
@@ -2910,7 +2913,7 @@
} }
} }
& + .comp_1x_b_v_s_b { &+.comp_1x_b_v_s_b {
position: relative; position: relative;
z-index: 2; z-index: 2;
margin-top: 2rem; margin-top: 2rem;
@@ -3183,7 +3186,7 @@
} }
} }
.contentWarp .productView .productRight .optionWarp .producOption .optionList .checkBtn.type2 input[type="checkbox"] + label { .contentWarp .productView .productRight .optionWarp .producOption .optionList .checkBtn.type2 input[type="checkbox"]+label {
height: auto; height: auto;
padding: 2rem 2rem 2rem 0; padding: 2rem 2rem 2rem 0;
@@ -3379,12 +3382,13 @@
// } // }
.comp_body { .comp_body {
.text_area { .text_area {
// display: flex; // display: flex;
h3 { h3 {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
> * { >* {
flex: 1; flex: 1;
} }
} }
@@ -3414,7 +3418,7 @@
.comp_wide { .comp_wide {
&.title-only { &.title-only {
& + .comp_wide { &+.comp_wide {
margin-top: 4rem; margin-top: 4rem;
} }
} }
@@ -3662,6 +3666,7 @@
} }
&.paused { &.paused {
.btn-play, .btn-play,
.btn-sound { .btn-sound {
display: block !important; display: block !important;
@@ -3793,6 +3798,7 @@
} }
&.playing { &.playing {
.comp_body.layer_up, .comp_body.layer_up,
.thumb-swiper, .thumb-swiper,
.pdpInCarGameSwiper, .pdpInCarGameSwiper,
@@ -3933,7 +3939,7 @@
.pdpDtl { .pdpDtl {
.swiper-navigation { .swiper-navigation {
> * { >* {
top: 210px; top: 210px;
left: -65px; left: -65px;
width: 5rem; width: 5rem;
@@ -3982,8 +3988,7 @@
} }
.scroll_area { .scroll_area {
@include maxtablet { @include maxtablet {}
}
.web { .web {
display: block; display: block;
@@ -4277,7 +4282,7 @@
display: block; display: block;
.swiper-slide { .swiper-slide {
& + .swiper-slide { &+.swiper-slide {
margin-top: 5rem; margin-top: 5rem;
} }
} }
@@ -4285,7 +4290,7 @@
} }
.swiper-navigation { .swiper-navigation {
> * { >* {
top: 210px; top: 210px;
left: -65px; left: -65px;
width: 5rem; width: 5rem;
@@ -4382,6 +4387,7 @@
br { br {
display: none; display: none;
&.br-m { &.br-m {
display: block; display: block;
@@ -4462,6 +4468,7 @@
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
gap: 5.6rem 0; gap: 5.6rem 0;
@include tablet { @include tablet {
justify-content: center; justify-content: center;
gap: 2.4rem; gap: 2.4rem;
@@ -4488,6 +4495,7 @@
a { a {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -4528,7 +4536,8 @@
margin-top: 2.4rem; margin-top: 2.4rem;
font-size: 1.6rem; font-size: 1.6rem;
} }
> * {
>* {
display: inline-block; display: inline-block;
} }
} }
@@ -4537,18 +4546,35 @@
&.more { &.more {
overflow: visible; overflow: visible;
position: relative;
// width: 32rem; // width: 32rem;
// height: 19.4rem; // height: 19.4rem;
width: 100%; width: 100%;
// height: vw(194); // height: vw(194);
aspect-ratio: 320 / 194; aspect-ratio: 320 / 190;
// padding: 2.4rem 2rem; // padding: 2.4rem 2rem;
padding: vw(24) vw(20); padding: vw(24) vw(20);
margin: 0; margin: 0;
background: url(../images/kia/pdp/display_theme_disney/box_more_m.png) no-repeat center / auto 100%;
// border-radius: 2rem 0.8rem 2rem 0.8rem; // border-radius: 2rem 0.8rem 2rem 0.8rem;
border-radius: vw(26) 0.8rem vw(26) 0.8rem; background-color: transparent;
box-shadow: 0px 0px 1rem 0px #0000001f; border-radius: 0;
box-shadow: none;
&:before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: vw(340);
height: vw(210);
background: url(../images/kia/pdp/display_theme_disney/box_more_m2.png) no-repeat center / auto 100%;
@include tablet {
display: none;
}
}
@include tablet { @include tablet {
width: 61rem; width: 61rem;
@@ -4617,8 +4643,7 @@
border-right: 1rem solid transparent; border-right: 1rem solid transparent;
border-top: 1rem solid #fbc707; border-top: 1rem solid #fbc707;
@include tablet { @include tablet {}
}
} }
} }
} }
@@ -4909,6 +4934,7 @@
@include tablet { @include tablet {
margin-bottom: 6.4rem; margin-bottom: 6.4rem;
} }
&:not(.welcome-goodbye) { &:not(.welcome-goodbye) {
.image_area { .image_area {
overflow: hidden; overflow: hidden;
@@ -4941,9 +4967,11 @@
margin-top: 1.4rem; margin-top: 1.4rem;
font-size: 1.6rem; font-size: 1.6rem;
} }
.add { .add {
font-size: 1rem; font-size: 1rem;
color: #969696; color: #969696;
@include tablet { @include tablet {
display: block; display: block;
font-size: 1.6rem; font-size: 1.6rem;
@@ -4966,7 +4994,7 @@
.welcome-goodbye { .welcome-goodbye {
.image_area { .image_area {
& + .image_area { &+.image_area {
margin-top: 0.4rem; margin-top: 0.4rem;
@include tablet { @include tablet {
@@ -4995,6 +5023,7 @@
@include tablet { @include tablet {
// padding: 9.6rem 0 0; // padding: 9.6rem 0 0;
} }
.inner { .inner {
position: relative; position: relative;
z-index: 1; z-index: 1;
@@ -5020,11 +5049,13 @@
height: 20rem; height: 20rem;
background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 30%, rgba(255, 255, 255, 0.4) 60%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 30%, rgba(255, 255, 255, 0.4) 60%, rgba(255, 255, 255, 0) 100%);
} }
@include desktopMax { @include desktopMax {
&::after { &::after {
display: none; display: none;
} }
} }
h3 { h3 {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@@ -5073,7 +5104,7 @@
align-items: center; align-items: center;
} }
& + li { &+li {
margin-top: 3.7rem; margin-top: 3.7rem;
@include tablet { @include tablet {
@@ -5108,6 +5139,7 @@
} }
} }
} }
&:nth-child(1) { &:nth-child(1) {
p { p {
@include tablet { @include tablet {
@@ -5191,6 +5223,7 @@
img { img {
display: block; display: block;
max-width: 100%; max-width: 100%;
&.web { &.web {
display: none; display: none;
} }
@@ -5199,6 +5232,7 @@
&.web { &.web {
display: block; display: block;
} }
&.mobile { &.mobile {
display: none; display: none;
} }
@@ -5208,15 +5242,19 @@
.img-msg { .img-msg {
display: flex; display: flex;
gap: 1rem; gap: 1rem;
@include tablet { @include tablet {
gap: 1.9rem; gap: 1.9rem;
} }
img { img {
width: 18rem; width: 18rem;
@include tablet { @include tablet {
width: 25.6rem; width: 25.6rem;
} }
} }
.msg { .msg {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
@@ -5237,6 +5275,7 @@
padding: 2rem; padding: 2rem;
font-size: 1.4rem; font-size: 1.4rem;
} }
&:before { &:before {
content: ""; content: "";
display: block; display: block;
@@ -5261,6 +5300,7 @@
color: #fff; color: #fff;
font-size: 1.2rem; font-size: 1.2rem;
text-align: center; text-align: center;
@include tablet { @include tablet {
margin-top: 16rem; margin-top: 16rem;
} }
@@ -5366,6 +5406,7 @@
.text_area { .text_area {
text-align: left; text-align: left;
} }
.comp_body { .comp_body {
.item { .item {
@include tablet { @include tablet {
@@ -5455,4 +5496,4 @@
text-indent: -9999em; text-indent: -9999em;
background: url(../images/kia/pdp/display_theme_disney/btn_zoom_close.png) no-repeat 0 0 / 100% auto; background: url(../images/kia/pdp/display_theme_disney/btn_zoom_close.png) no-repeat 0 0 / 100% auto;
cursor: pointer; cursor: pointer;
} }

BIN
kr/assets/images/kia/pdp/display_theme_disney/box_more_m.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.4 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
kr/assets/images/kia/pdp/display_theme_disney/box_more_m2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 36 KiB