구매완료 팝업추가
This commit is contained in:
@@ -224,3 +224,110 @@
|
||||
margin-left: 1rem;
|
||||
background-position: center;
|
||||
}
|
||||
.popupWarp.payComplete {
|
||||
position: fixed;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 500;
|
||||
}
|
||||
.popupWarp.payComplete .popInner {
|
||||
position: relative;
|
||||
top: 55%;
|
||||
max-width: 120rem;
|
||||
height: 84.5rem;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
background: url(../images/kia/contents/poup_complete.jpg) no-repeat center/cover;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents {
|
||||
position: absolute;
|
||||
bottom: 14%;
|
||||
right: 11.5%;
|
||||
width: 44rem;
|
||||
height: 45.5rem;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents .logo {
|
||||
display: block;
|
||||
height: 1.6rem;
|
||||
margin-bottom: 1.9rem;
|
||||
background-image: url(../images/kia/kia-logo-n.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: auto 100%;
|
||||
text-indent: -9999em;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents .payInfoCon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 44rem;
|
||||
height: 42rem;
|
||||
background-color: #fff;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p strong {
|
||||
display: block;
|
||||
font-size: 2.8rem;
|
||||
line-height: 3.4rem;
|
||||
margin-bottom: 3rem;
|
||||
text-align: center;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p span {
|
||||
display: block;
|
||||
font-size: 1.6rem;
|
||||
color: #676767;
|
||||
line-height: 2.4rem;
|
||||
text-align: center;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.popupWarp.payComplete .popInner {
|
||||
max-height: 64rem;
|
||||
background: url(../images/kia/contents/poup_complete_m.jpg) no-repeat center/cover;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents {
|
||||
position: absolute;
|
||||
bottom: 3rem;
|
||||
right: auto;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents .logo {
|
||||
display: block;
|
||||
width: 81.25%;
|
||||
height: 1.2rem;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents .payInfoCon {
|
||||
width: 81.25%;
|
||||
height: 26rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p {
|
||||
padding: 0 3rem;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p strong {
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.92rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p span {
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.44rem;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents p span em {
|
||||
display: block;
|
||||
}
|
||||
.popupWarp.payComplete .popInner .popContents .oneButton {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
}
|
||||
@media (max-width: 320px) {
|
||||
.popupWarp.payComplete .popInner .popContents p {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
/*# sourceMappingURL=popup.css.map */
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sources":["popup.css","_utils.scss","popup.scss"],"names":[],"mappings":"AAAA,gBAAgB;ACAhB,KAAA;AAGA,YAAA;AAOA,mBAAA;AACA,2BAAA;AAiBA,2BAAA;AACA,yDAAA;AAmBA,4BAAA;AAOA,4BAAA;AAOA,iBAAA;AC5DA,cAAA;AAEA;EACI,eAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;EACA,oCAAA;EACA,aAAA;AFQJ;AENI;EACI,sBAAA;EACA,aAAA;EACA,qBAAA;AFQR;AEPQ;EACI,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;AFSZ;AEPQ;EACI,aAAA;EACA,gBAAA;EACA,kBAAA;AFSZ;AERa;EACG,UAAA;AFUhB;AERY;EACI,yBAAA;EACA,mBAAA;EACA,4BAAA;EACA,6BAAA;AFUhB;AERY;EACI,6BAAA;EACA,mBAAA;EACA,mCAAA;AFUhB;AERY;EACI,mBAAA;EACA,cAAA;AFUhB;AEPQ;EACI,YAAA;EACA,cAAA;EACA,gBAAA;AFSZ;AEPQ;EACI,cAAA;EACA,gBAAA;AFSZ;AENI;EACI,kBAAA;EACA,UAAA;EACA,SAAA;EACA,QAAA;EACA,gCAAA;AFQR;ACbE;ECAE;IAOQ,0BAAA;IAAA,uBAAA;IAAA,kBAAA;IACA,WAAA;EFUV;AACF;AERI;EACI,gBAAA;AFUR;AEPI;EACI,gBAAA;AFSR;AENgB;EACI,cAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;AFQpB;AENgB;EACI,kBAAA;EACA,cAAA;EACA,iBAAA;EACA,cAAA;EACA,kBAAA;EACA,mBAAA;AFQpB","file":"popup.css"}
|
||||
{"version":3,"sources":["popup.css","_utils.scss","popup.scss"],"names":[],"mappings":"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","file":"popup.css"}
|
||||
@@ -224,4 +224,120 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.payComplete{
|
||||
position: fixed;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 500;
|
||||
.popInner {
|
||||
position: relative;
|
||||
top:55%;
|
||||
max-width:120rem;
|
||||
height: 84.5rem;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
background: url(../images/kia/contents/poup_complete.jpg) no-repeat center / cover;
|
||||
.popContents{
|
||||
position: absolute;
|
||||
bottom:14%;
|
||||
right: 11.5%;
|
||||
width: 44rem;
|
||||
height: 45.5rem;
|
||||
.logo {
|
||||
display: block;
|
||||
height: 1.6rem;
|
||||
margin-bottom:1.9rem;
|
||||
background-image: url(../images/kia/kia-logo-n.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: auto 100%;
|
||||
text-indent: -9999em;
|
||||
}
|
||||
.payInfoCon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 44rem;
|
||||
height: 42rem;
|
||||
background-color: #fff;
|
||||
}
|
||||
p{
|
||||
strong{
|
||||
display: block;
|
||||
font-size: 2.8rem;
|
||||
line-height: 3.4rem;
|
||||
margin-bottom:3rem;
|
||||
text-align: center;
|
||||
}
|
||||
span{
|
||||
display: block;
|
||||
font-size: 1.6rem;
|
||||
color: #676767;
|
||||
line-height: 2.4rem;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@include maxtablet{
|
||||
max-height: 64rem;
|
||||
background: url(../images/kia/contents/poup_complete_m.jpg) no-repeat center / cover;
|
||||
.popContents {
|
||||
position: absolute;
|
||||
bottom: 3rem;
|
||||
right: auto;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
.logo {
|
||||
display: block;
|
||||
width: 81.25%;
|
||||
height: 1.2rem;
|
||||
margin: 0 auto;
|
||||
margin-bottom:1.2rem;
|
||||
}
|
||||
.payInfoCon {
|
||||
width: 81.25%;
|
||||
height: 26rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
p{
|
||||
padding:0 3rem;
|
||||
strong{
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.92rem;
|
||||
margin-bottom:2rem;
|
||||
}
|
||||
span{
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.44rem;
|
||||
em {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.oneButton {
|
||||
margin-top:4rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 320px){
|
||||
.popContents {
|
||||
p {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
BIN
assets/images/kia/contents/poup_complete.jpg
Normal file
BIN
assets/images/kia/contents/poup_complete.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 381 KiB |
BIN
assets/images/kia/contents/poup_complete_m.jpg
Normal file
BIN
assets/images/kia/contents/poup_complete_m.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 315 KiB |
@@ -33,7 +33,7 @@
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/aos.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1"></script>
|
||||
<!--상품상세 페이지 css 분리-->
|
||||
<link rel="stylesheet" charset="UTF-8" href="/kr/assets/css/order.css?v1" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/order.css?v1" type="text/css" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">
|
||||
@@ -422,10 +422,38 @@
|
||||
hide: true,
|
||||
},
|
||||
});
|
||||
setTimeout(open_layer_popup, 1000, 'install_info');
|
||||
// setTimeout(open_layer_popup, 1000, 'install_info');
|
||||
</script>
|
||||
<!-- [E] -->
|
||||
|
||||
<!-- [S] 2024-07-22 구매 완료 팝업 -->
|
||||
<div id="pay_complete" class="popupWarp payComplete" style="display:none; opacity:0;">
|
||||
|
||||
<div class="popInner">
|
||||
<div class="popContents">
|
||||
<h2 class="logo">Kia Connect Store</h2>
|
||||
<div class="payInfoCon">
|
||||
<p>
|
||||
<strong>커넥트 스토어 상품 구매를 <br>진심으로 축하드립니다~!!!</strong>
|
||||
<span>
|
||||
<em>지금 바로 새로운 기능을 추가하여</em> 더욱 안전하고 <br>즐거운 드라이빙을 해보세요!!
|
||||
</span>
|
||||
</p>
|
||||
<div class="carswBtn">
|
||||
<div class="oneButton">
|
||||
<a href="javascript:;" class="PurchaseBtn" onClick="javascript:close_layer_popup('pay_complete');"><p>확인</p></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
setTimeout(open_layer_popup, 1000, 'pay_complete');
|
||||
</script>
|
||||
<!-- [E] 2024-07-22 구매 완료 팝업 -->
|
||||
|
||||
<!--//footer-->
|
||||
<div class="floating_menu">
|
||||
<a href="../service/faq.html" class="floating_faq"><img src="../assets/images/common/floating_inquiry.png" alt="자주하는 질문"></a>
|
||||
|
||||
@@ -224,6 +224,34 @@
|
||||
</script>
|
||||
<!-- [E] -->
|
||||
|
||||
<!-- [S] 2024-07-22 구매 완료 팝업 -->
|
||||
<div id="pay_complete" class="popupWarp payComplete" style="display:none; opacity:0;">
|
||||
|
||||
<div class="popInner">
|
||||
<div class="popContents">
|
||||
<h2 class="logo">Kia Connect Store</h2>
|
||||
<div class="payInfoCon">
|
||||
<p>
|
||||
<strong>커넥트 스토어 상품 구매를 <br>진심으로 축하드립니다~!!!</strong>
|
||||
<span>
|
||||
<em>지금 바로 새로운 기능을 추가하여</em> 더욱 안전하고 <br>즐거운 드라이빙을 해보세요!!
|
||||
</span>
|
||||
</p>
|
||||
<div class="carswBtn">
|
||||
<div class="oneButton">
|
||||
<a href="javascript:;" class="PurchaseBtn" onClick="javascript:close_layer_popup('pay_complete');"><p>확인</p></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
setTimeout(open_layer_popup, 1000, 'pay_complete');
|
||||
</script>
|
||||
<!-- [E] 2024-07-22 구매 완료 팝업 -->
|
||||
|
||||
<!--//footer-->
|
||||
<?php
|
||||
include($_SERVER['DOCUMENT_ROOT']."/kr/include/footer.php");
|
||||
|
||||
1046
product/pdp_display_theme_popup.html
Normal file
1046
product/pdp_display_theme_popup.html
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user