Commit 6fa26eba authored by 김은해_이모션's avatar 김은해_이모션

[김은해] 20220121 작업

parent 2253fd60
......@@ -566,13 +566,73 @@
}
.seller-tab-area .tab-content {
padding: 40px 20px;
padding: 20px;
background-color: #efeff1;
/* 2022.01.21 수정 */
}
.seller-tab-area .tab-content img {
max-width: 100%;
}
/* 2022.01.21 특장점 추가 */
.seller-tab-area .feature-point-tit {
border-radius: 4px;
border: 1px solid #c7c7c7;
text-align: center;
line-height:40px;
font-size:1.5rem;
color:#666;
}
.seller-tab-area .feature-point-item {
margin-bottom:1.2rem;
}
.seller-tab-area .fp-item-group {
display:flex;
flex-wrap: wrap;
align-items: flex-start;
margin-top:0.4rem;
}
.seller-tab-area .group-box {
width:calc(50% - 0.4rem);
margin-top:0.8rem;
}
.seller-tab-area .group-box:nth-child(odd){
margin-right:0.8rem;
}
.seller-tab-area .group-box.wide-group-box {
width:100%;
}
.seller-tab-area .group-box.wide-group-box:nth-child(odd) {
margin-right:0;
}
.seller-tab-area .group-box.front-camera {
margin:0.8rem 0 0 0.8rem;
}
.seller-tab-area .fp-item-desc
{
background-color: #fafafa;
text-align: center;
max-height:160px;
padding:1.5rem 0 2rem;
}
.seller-tab-area .fp-item-tit {
font-size:1.3rem;
}
.sticky-bar .layer-pay {
transition: all .3s ease;
box-shadow: 0 -2px 10px 0 rgba(207, 207, 207, 0.88);
......
......@@ -424,8 +424,250 @@
<div data-tab-content="seller-detail-tab" class="tab-content" style="display:none;">
<h3 class="g-invisible">특장점</h3>
<div id="featurePoint" class="feature-point-contents">
<img src="../img/@/@temp-feature-point@2x.png" alt="">
<img src="https://cdnw.shop.tworld.co.kr/pimg/plan_editor/202102/112925205067501647.jpg" alt="">
<!-- 특장점 리뉴얼 22.01.21-->
<!-- 공통 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">공통</h4>
<div class="fp-item-group">
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">운영체제</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">안드로이드</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">통신</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">5G통신 지원</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">USIM종류</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">나노유심</div>
</div>
</div>
</div>
</div>
<!-- //공통 -->
<!-- 외관 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">외관</h4>
<div class="fp-item-group">
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">휴대폰 크기</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">가로X세로X두께<br>(단위:㎜)</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">무게</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">226g</div>
</div>
</div>
</div>
</div>
<!-- //외관 -->
<!-- 디스플레이 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">디스플레이</h4>
<div class="fp-item-group">
<div class="group-box wide-group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">디스플레이</h5>
<div class="row-box">
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
</div>
</div>
</div>
<!-- //디스플레이 -->
<!-- 성능 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">성능</h4>
<div class="fp-item-group">
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">프로세서</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">헥사코어,7GHz</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">RAM</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">6GB RAM</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">배터리 용량</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">2815mAh</div>
</div>
</div>
</div>
</div>
<!-- //성능 -->
<!-- 카메라 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">카메라</h4>
<div class="fp-item-group">
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 6/7/8</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 6/7/8</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 10</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 11/12</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 13</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 11/12/13pro</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box wide-group-box">
<div class="phone-tag">i Phone 1N~</div>
<div class="fp-item-desc">
<h5 class="fp-item-tit">제조사</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">삼성</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">전면 카메라</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">
<span>와이드</span>
<span>F1.6</span>
<span>12MP</span>
</div>
</div>
</div>
<div class="group-box front-camera">
<div class="fp-item-desc">
<h5 class="fp-item-tit">전면 카메라</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">
<span>와이드+와이드</span>
<span>F1.6+F2.0</span>
<span>12MP+12MP</span>
</div>
</div>
</div>
<div>※ 실제 카메라 배치와 다를 수 있습니다.</div>
</div>
</div>
<!-- //카메라 -->
<!-- 연결/기타 -->
<div class="feature-point-item">
<h4 class="feature-point-tit">연결/기타</h4>
<div class="fp-item-group">
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">방수 및 방진</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">IP68등급 획득</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">얼굴인식</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">얼굴인식 지원</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">지문인식</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">지문인식 지원</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">충전단자</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">라이트닝 8핀</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">Pen</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">Pen지원</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">무선충전</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">무선충전 지원</div>
</div>
</div>
<div class="group-box">
<div class="fp-item-desc">
<h5 class="fp-item-tit">전자결제</h5>
<div class="fp-item-img"></div>
<div class="fp-item-txt">전자결제(pay)지원</div>
</div>
</div>
</div>
</div>
<!-- //연결/기타 -->
<!-- //특장점 리뉴얼 22.01.21-->
</div>
</div>
<div data-tab-content="seller-detail-tab" class="tab-content" style="display:none">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment