포토리뷰 작업 중

This commit is contained in:
2026-01-05 22:17:09 +09:00
parent e0eb8418ec
commit 534015a521
11 changed files with 111 additions and 29 deletions

View File

@@ -1673,6 +1673,13 @@ body.scroll-up .hederWarp_n .mobileOpenMenu {
background-color: #fff;
border-top: 1px solid #dedede;
}
.hederWarp_n .headerInner .mobileOpenMenu:after {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #dedede;
}
.hederWarp_n .headerInner .mobileOpenMenu.hBoder {
border-bottom: 1px solid #dedede;
}
@@ -1680,6 +1687,7 @@ body.scroll-up .hederWarp_n .mobileOpenMenu {
overflow-x: auto;
scrollbar-width: none;
-ms-overflow-style: none;
margin-bottom: -1px;
display: flex;
align-items: center;
white-space: nowrap;
@@ -4834,7 +4842,7 @@ body.scroll-up .infoSticky {
right: 0;
width: 3rem;
height: 3rem;
background: url(../images/common/icon-menu-close.svg) no-repeat center/1.8rem auto;
background: url(../images/common/icon-close.png) no-repeat center/100% auto;
text-indent: -9999em;
}
@media (min-width: 768px) {
@@ -5535,7 +5543,7 @@ body.scroll-up .infoSticky {
right: 0;
width: 3rem;
height: 3rem;
background: url(../images/common/icon-menu-close.svg) no-repeat center/1.8rem auto;
background: url(../images/common/icon-close.png) no-repeat center/100% auto;
text-indent: -9999em;
}
@media (min-width: 768px) {

File diff suppressed because one or more lines are too long

View File

@@ -1955,6 +1955,13 @@ video::-webkit-media-controls {
padding-top: 0.4rem;
background-color: #fff;
border-top: 1px solid #dedede;
&:after {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #dedede;
}
&.hBoder {
border-bottom: 1px solid #dedede;
@@ -1964,6 +1971,7 @@ video::-webkit-media-controls {
overflow-x: auto;
scrollbar-width: none;
-ms-overflow-style: none;
margin-bottom: -1px;
&::-webkit-scrollbar {
display: none;
@@ -5373,7 +5381,7 @@ video::-webkit-media-controls {
right: 0;
width: 3rem;
height: 3rem;
background: url(../images/common/icon-menu-close.svg) no-repeat center / 1.8rem auto;
background: url(../images/common/icon-close.png) no-repeat center / 100% auto;
text-indent: -9999em;
@include tablet {
display: none;
@@ -6120,7 +6128,7 @@ video::-webkit-media-controls {
right: 0;
width: 3rem;
height: 3rem;
background: url(../images/common/icon-menu-close.svg) no-repeat center / 1.8rem auto;
background: url(../images/common/icon-close.png) no-repeat center / 100% auto;
text-indent: -9999em;
@include tablet {
display: none;

View File

@@ -4710,6 +4710,7 @@ pre {
color: #fff;
font-size: 1.2rem;
font-weight: 600;
line-height: 0;
}
@media (min-width: 768px) {
.contentWarp .mypageWarp .rightConWarp .reviewListWrap .unpublished .cartItemWrap:after {

File diff suppressed because one or more lines are too long

View File

@@ -5189,6 +5189,7 @@ pre {
color: #fff;
font-size: 1.2rem;
font-weight: 600;
line-height: 0;
@include tablet {
position: absolute;
top: 1.6rem;

View File

@@ -1647,15 +1647,15 @@
gap: 1rem;
}
.reviewArea .reviewInner .reviewList .item .textArea .photoArea .photoItem {
width: 8rem;
height: 8rem;
width: 7.2rem;
height: 7.2rem;
border-radius: 0.8rem;
overflow: hidden;
}
@media (min-width: 768px) {
.reviewArea .reviewInner .reviewList .item .textArea .photoArea .photoItem {
width: 12rem;
height: 12rem;
width: 16rem;
height: 16rem;
}
}
.reviewArea .reviewInner .reviewList .item .textArea .photoArea .photoItem button {
@@ -1669,6 +1669,8 @@
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
}
.reviewArea .reviewInner .reviewList .item .textArea .contentMoreBtn {
display: none;
@@ -5548,8 +5550,6 @@ body.scroll-up .displayThemeDesney.discover-epic-design .tab-wrap .tab-menu {
border-top: 1px solid #dedede;
margin: 3rem 0;
padding: 3rem 0 0;
overflow: hidden;
overflow-x: auto;
display: flex;
flex-wrap: wrap;
}
@@ -5575,6 +5575,14 @@ body.scroll-up .displayThemeDesney.discover-epic-design .tab-wrap .tab-menu {
aspect-ratio: 16/16;
}
}
.photoReviewList ul li:nth-child(n+5):nth-child(-n+6) {
display: none;
}
@media (min-width: 768px) {
.photoReviewList ul li:nth-child(n+5):nth-child(-n+6) {
display: block;
}
}
.photoReviewList ul li button {
cursor: pointer;
}
@@ -5623,6 +5631,30 @@ body.scroll-up .displayThemeDesney.discover-epic-design .tab-wrap .tab-menu {
font-size: 2rem;
}
}
.photoReviewList ul li .allPhotoReview-mobile {
display: block;
}
@media (min-width: 768px) {
.photoReviewList ul li .allPhotoReview-mobile {
display: none;
}
}
.photoReviewList ul li .allPhotoReview-pc {
display: none;
}
@media (min-width: 768px) {
.photoReviewList ul li .allPhotoReview-pc {
display: block;
}
}
.reviewArea .photoReviewList ul li:nth-child(5) button:not(.photoReviewAllPopup.allPhotoReview-mobile) {
display: none;
}
@media (min-width: 768px) {
.reviewArea .photoReviewList ul li:nth-child(5) button:not(.photoReviewAllPopup.allPhotoReview-mobile) {
display: block;
}
}
.popInner .photoReviewList ul {
flex-wrap: wrap;
}

File diff suppressed because one or more lines are too long

View File

@@ -1759,13 +1759,13 @@
margin-top: 1rem;
gap: 1rem;
.photoItem {
width: 8rem;
height: 8rem;
width: 7.2rem;
height: 7.2rem;
border-radius: 0.8rem;
overflow: hidden;
@include tablet {
width: 12rem;
height: 12rem;
width: 16rem;
height: 16rem;
}
button {
width: 100%;
@@ -1777,6 +1777,7 @@
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
}
}
@@ -6269,8 +6270,8 @@
border-top: 1px solid #dedede;
margin: 3rem 0;
padding: 3rem 0 0;
overflow: hidden;
overflow-x: auto;
// overflow: hidden;
// overflow-x: auto;
display: flex;
flex-wrap: wrap;
ul {
@@ -6290,12 +6291,12 @@
aspect-ratio: 16 / 16;
}
// 4~6 번째 숨김
// &:nth-child(n + 4):nth-child(-n + 6) {
// display: none;
// @include tablet {
// display: block;
// }
// }
&:nth-child(n + 5):nth-child(-n + 6) {
display: none;
@include tablet {
display: block;
}
}
button {
cursor: pointer;
}
@@ -6345,6 +6346,32 @@
}
}
}
// 모바일용 전체 포토리뷰 버튼 (4번째에 표시)
.allPhotoReview-mobile {
display: block;
@include tablet {
display: none;
}
}
// PC용 전체 포토리뷰 버튼 (7번째에 표시)
.allPhotoReview-pc {
display: none;
@include tablet {
display: block;
}
}
// 4번째 li의 일반 버튼은 모바일에서 숨김
.reviewArea &:nth-child(5) {
button:not(.photoReviewAllPopup.allPhotoReview-mobile) {
display: none;
@include tablet {
display: block;
}
}
}
}
.popInner & {

Binary file not shown.

After

Width:  |  Height:  |  Size: 411 B

View File

@@ -1117,6 +1117,11 @@
<img src="../assets/images/kia/product-img/phptoreview-temp4.jpg" alt="리뷰 이미지">
<div class="count">2</div>
</button>
<!-- 모바일용 전체 포토리뷰 버튼 -->
<button class="allPhotoReview allPhotoReview-mobile" onclick="open_layer_popup('photoReviewAll_Popup')">
<img src="../assets/images/kia/product-img/phptoreview-temp4.jpg" alt="리뷰 이미지">
</button>
<!-- //모바일용 전체 포토리뷰 버튼 -->
</li>
<li>
<button onclick="open_layer_popup('photoReviewDetail_Popup')">
@@ -1129,11 +1134,11 @@
</button>
</li>
<li>
<!-- 전체 포토리뷰 버튼 -->
<button class="allPhotoReview" onclick="open_layer_popup('photoReviewAll_Popup')">
<!-- PC용 전체 포토리뷰 버튼 -->
<button class="allPhotoReview allPhotoReview-pc" onclick="open_layer_popup('photoReviewAll_Popup')">
<img src="../assets/images/kia/product-img/phptoreview-temp7.jpg" alt="리뷰 이미지">
</button>
<!-- //전체 포토리뷰 버튼 -->
<!-- //PC용 전체 포토리뷰 버튼 -->
</li>
</ul>
@@ -1186,7 +1191,7 @@
<button onclick="open_layer_popup('photoReviewDetail_Popup');"><img src="../assets/images/kia/product-img/phptoreview-temp1-1.jpg" alt="리뷰 이미지"></button>
</div>
<div class="photoItem">
<button onclick="open_layer_popup('photoReviewDetail_Popup');"><img src="../assets/images/kia/product-img/phptoreview-temp1-2.jpg" alt="리뷰 이미지"></button>
<button onclick="open_layer_popup('photoReviewDetail_Popup');"><img src="../assets/images/kia/pdp/display_theme_mickey/Theme_screen_m.jpg" alt="리뷰 이미지"></button>
</div>
<div class="photoItem">
<button onclick="open_layer_popup('photoReviewDetail_Popup');"><img src="../assets/images/kia/product-img/phptoreview-temp1-3.jpg" alt="리뷰 이미지"></button>