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

1차 수정4

Browse Source
This commit is contained in:
hyeonggil
2024-07-23 14:10:06 +09:00
parent 9f0cfae1dc
commit cee833d7af
7 changed files with 296 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
assets/css/popup.css
View File

@@ -224,7 +224,8 @@
margin-left: 1rem;
background-position: center;
}
.popupWarp.payComplete {
.payComplete {
position: fixed;
overflow: hidden;
width: 100%;
@@ -235,23 +236,27 @@
left: 0;
z-index: 500;
}
.popupWarp.payComplete .popInner {
position: relative;
.payComplete .popInner {
position: absolute;
top: 55%;
left: 50%;
width: 100%;
max-width: 120rem;
height: 84.5rem;
height: 90rem;
transform: translateX(-50%);
margin-top: -45rem;
padding: 0;
border-radius: 0;
background: url(../images/kia/contents/poup_complete.jpg) no-repeat center/cover;
}
.popupWarp.payComplete .popInner .popContents {
.payComplete .popInner .popContents {
position: absolute;
bottom: 14%;
right: 11.5%;
bottom: 10%;
right: 8.333%;
width: 44rem;
height: 45.5rem;
}
.popupWarp.payComplete .popInner .popContents .logo {
.payComplete .popInner .popContents .logo {
display: block;
height: 1.6rem;
margin-bottom: 1.9rem;
@@ -260,7 +265,7 @@
background-size: auto 100%;
text-indent: -9999em;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon {
.payComplete .popInner .popContents .payInfoCon {
display: flex;
justify-content: center;
flex-direction: column;
@@ -268,14 +273,14 @@
height: 42rem;
background-color: #fff;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p strong {
.payComplete .popInner .popContents .payInfoCon > p strong {
display: block;
font-size: 2.8rem;
line-height: 3.4rem;
margin-bottom: 3rem;
text-align: center;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p span {
.payComplete .popInner .popContents .payInfoCon > p span {
display: block;
font-size: 1.6rem;
color: #676767;
@@ -283,50 +288,56 @@
text-align: center;
}
@media (max-width: 768px) {
.popupWarp.payComplete .popInner {
.payComplete .popInner {
max-height: 64rem;
width: calc(100% - 4rem);
background: url(../images/kia/contents/poup_complete_m.jpg) no-repeat center/cover;
transform: translate(-50%, -50%);
margin-top: 0;
}
.popupWarp.payComplete .popInner .popContents {
.payComplete .popInner .popContents {
position: absolute;
bottom: 3rem;
right: auto;
width: 100%;
height: auto;
}
.popupWarp.payComplete .popInner .popContents .logo {
.payComplete .popInner .popContents .logo {
display: block;
width: 81.25%;
height: 1.2rem;
margin: 0 auto;
margin-bottom: 1.2rem;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon {
.payComplete .popInner .popContents .payInfoCon {
width: 81.25%;
height: 26rem;
height: 27.7rem;
margin: 0 auto;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p {
.payComplete .popInner .popContents .payInfoCon > p {
padding: 0 3rem;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p strong {
font-size: 1.6rem;
line-height: 1.92rem;
margin-bottom: 2rem;
.payComplete .popInner .popContents .payInfoCon > p strong {
font-size: 1.8rem;
line-height: 2.16rem;
margin-bottom: 1.6rem;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p span {
font-size: 1.2rem;
line-height: 1.44rem;
.payComplete .popInner .popContents .payInfoCon > p span {
font-size: 1.4rem;
line-height: 1.68rem;
}
.popupWarp.payComplete .popInner .popContents .payInfoCon > p span em {
.payComplete .popInner .popContents .payInfoCon > p span em {
display: block;
}
.popupWarp.payComplete .popInner .popContents .oneButton {
margin-top: 4rem;
.payComplete .popInner .popContents .payInfoCon > p span br {
display: none;
}
.payComplete .popInner .popContents .oneButton {
margin-top: 3rem;
}
}
@media (max-width: 320px) {
.popupWarp.payComplete .popInner .popContents .payInfoCon > p {
.payComplete .popInner .popContents .payInfoCon > p {
padding: 0 1rem;
}
}

2
assets/css/popup.css.map
View File

@@ -1 +1 @@
{"version":3,"sources":["popup.css","_utils.scss","popup.scss"],"names":[],"mappings":"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","file":"popup.css"}
{"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;AENQ;EACI,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;AFQZ;AELQ;EACI,aAAA;EACA,gBAAA;EACA,kBAAA;AFOZ;AELY;EACI,UAAA;AFOhB;AEJY;EACI,yBAAA;EACA,mBAAA;EACA,4BAAA;EACA,6BAAA;AFMhB;AEHY;EACI,6BAAA;EACA,mBAAA;EACA,mCAAA;AFKhB;AEFY;EACI,mBAAA;EACA,cAAA;AFIhB;AEAQ;EACI,YAAA;EACA,cAAA;EACA,gBAAA;AFEZ;AECQ;EACI,cAAA;EACA,gBAAA;AFCZ;AC3BE;ECtBE;IAoDQ,aAAA;EFCV;AACF;AEEI;EACI,kBAAA;EACA,UAAA;EACA,SAAA;EACA,QAAA;EACA,gCAAA;AFAR;AClBE;ECaE;IAQQ,0BAAA;IAAA,uBAAA;IAAA,kBAAA;IACA,WAAA;EFCV;AACF;AEEI;EACI,gBAAA;AFAR;AEGI;EACI,gBAAA;AFDR;AEKgB;EACI,cAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;AFHpB;AEMgB;EACI,kBAAA;EACA,cAAA;EACA,iBAAA;EACA,cAAA;EACA,kBAAA;EACA,mBAAA;AFJpB;AEUI;EACI,gBAAA;AFRR;AEWY;EACI,kBAAA;AFThB;AEWgB;EACI,cAAA;EACA,iBAAA;EACA,mBAAA;AFTpB;AEYgB;EACI,kBAAA;EACA,cAAA;EACA,iBAAA;EACA,cAAA;EACA,kBAAA;EACA,mBAAA;AFVpB;AEagB;EACI,gBAAA;EACA,aAAA;EACA,iBAAA;EACA,mBAAA;EACA,cAAA;EACA,6BAAA;EACA,gCAAA;AFXpB;AEiBY;EACI,WAAA;AFfhB;AEmBQ;EACI,kBAAA;EACA,gBAAA;AFjBZ;AEmBY;EACI,aAAA;EACA,WAAA;EACA,uBAAA;EACA,mBAAA;EACA,kBAAA;EACA,iBAAA;EACA,cAAA;EACA,eAAA;AFjBhB;AEmBgB;EACI,iBAAA;AFjBpB;ACjHE;ECwIU;IACI,iBAAA;IACA,qBAAA;EFpBd;EEwBc;IACI,iBAAA;EFtBlB;EEwBkB;IACI,kBAAA;EFtBtB;EE2BU;IACI,uBAAA;EFzBd;EE2Bc;IACI,gBAAA;IACA,eAAA;EFzBlB;EE2BkB;IACI,gBAAA;EFzBtB;EE8BU;IACI,gBAAA;EF5Bd;EE8Bc;IACI,iBAAA;EF5BlB;AACF;AEiCI;EACI,gBAAA;AF/BR;AEkCY;EACI,iBAAA;EACA,mBAAA;EACA,kBAAA;AFhChB;AEkCgB;EACI,kBAAA;EACA,cAAA;EACA,iBAAA;EACA,cAAA;EACA,kBAAA;EACA,mBAAA;AFhCpB;AEoCY;EACI,gBAAA;EACA,eAAA;EACA,yBAAA;EACA,kBAAA;AFlChB;AEoCgB;EACI,kBAAA;EACA,eAAA;EACA,gCAAA;EACA,kBAAA;EACA,iBAAA;EACA,gBAAA;EACA,gBAAA;EACA,cAAA;AFlCpB;AEoCoB;EACI,WAAA;EACA,qBAAA;EACA,kBAAA;EACA,YAAA;EACA,SAAA;EACA,WAAA;EACA,YAAA;EACA,oEAAA;EACA,4BAAA;EACA,8BAAA;EACA,iBAAA;EACA,2BAAA;AFlCxB;;AE4CA;EACI,eAAA;EACA,gBAAA;EACA,WAAA;EACA,YAAA;EACA,aAAA;EACA,oCAAA;EACA,MAAA;EACA,OAAA;EACA,YAAA;AFzCJ;AE2CI;EACI,kBAAA;EACA,QAAA;EACA,SAAA;EACA,WAAA;EACA,iBAAA;EACA,aAAA;EACA,2BAAA;EACA,kBAAA;EACA,UAAA;EACA,gBAAA;EACA,gFAAA;AFzCR;AE2CQ;EACI,kBAAA;EACA,WAAA;EACA,aAAA;EACA,YAAA;EACA,eAAA;AFzCZ;AE2CY;EACI,cAAA;EACA,cAAA;EACA,qBAAA;EACA,mDAAA;EACA,4BAAA;EACA,0BAAA;EACA,oBAAA;AFzChB;AE4CY;EACI,aAAA;EACA,uBAAA;EACA,sBAAA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;AF1ChB;AE6CoB;EACI,cAAA;EACA,iBAAA;EACA,mBAAA;EACA,mBAAA;EACA,kBAAA;AF3CxB;AE8CoB;EACI,cAAA;EACA,iBAAA;EACA,cAAA;EACA,mBAAA;EACA,kBAAA;AF5CxB;AC1PE;ECkPE;IA4DQ,iBAAA;IACA,wBAAA;IACA,kFAAA;IAEA,gCAAA;IACA,aAAA;EFjDV;EEmDU;IACI,kBAAA;IACA,YAAA;IACA,WAAA;IACA,WAAA;IACA,YAAA;EFjDd;EEmDc;IACI,cAAA;IACA,aAAA;IACA,cAAA;IACA,cAAA;IACA,qBAAA;EFjDlB;EEoDc;IACI,aAAA;IACA,eAAA;IACA,cAAA;EFlDlB;EEoDkB;IACI,eAAA;EFlDtB;EEoDsB;IACI,iBAAA;IACA,oBAAA;IACA,qBAAA;EFlD1B;EEqDsB;IACI,iBAAA;IACA,oBAAA;EFnD1B;EEqD0B;IACI,cAAA;EFnD9B;EEsD0B;IACI,aAAA;EFpD9B;EE0Dc;IACI,gBAAA;EFxDlB;AACF;AE6DQ;EAGY;IACI,eAAA;EF7DtB;AACF","file":"popup.css"}

414
assets/css/popup.scss
View File

@@ -2,117 +2,136 @@
@import 'utils.scss';
/*변수파일 import*/
.popupWarp{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
background-color: rgba(0,0,0,0.4);
z-index:1000;
.popInner{
.popupWarp {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: rgba(0, 0, 0, 0.4);
z-index: 1000;
.popInner {
background-color: #fff;
padding:5rem;
padding: 5rem;
border-radius: 0.6rem;
h1{
h1 {
font-size: 2.4rem;
font-weight: bold;
text-align: center;
margin-bottom:3rem;
margin-bottom: 3rem;
}
.termsCon{
height:29rem;
.termsCon {
height: 29rem;
overflow-y: auto;
overflow-x: hidden;
&::-webkit-scrollbar {
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-thumb {
background-color: #DEDEDE;
border-radius: 10px;
background-clip: padding-box;
border: 2px solid transparent;
}
&::-webkit-scrollbar-track {
background-color: transparent;
border-radius: 10px;
box-shadow: inset 0px 0px 5px white;
}
p{
p {
line-height: 2.4rem;
color: #676767;
}
}
.oneButton{
width:16rem;
margin:0 auto;
margin-top:5rem;
.oneButton {
width: 16rem;
margin: 0 auto;
margin-top: 5rem;
}
.towButton{
margin:0 auto;
margin-top:5rem;
.towButton {
margin: 0 auto;
margin-top: 5rem;
}
@include maxtablet{
@include maxtablet {
padding: 3rem;
}
}
.popInner{
.popInner {
position: absolute;
width: 92%;
left:50%;
top:50%;
transform: translate(-50%,-50%);
@include desktopMax{
width:fit-content;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
@include desktopMax {
width: fit-content;
width: 100%;
}
}
.termsPop{
max-width:90rem;
.termsPop {
max-width: 90rem;
}
.payInfo{
max-width:54rem;
.payInfoCon{
p{
strong{
.payInfo {
max-width: 54rem;
.payInfoCon {
p {
strong {
display: block;
font-size: 1.6rem;
line-height: 2.4rem;
text-align: center;
}
span{
span {
text-align: center;
display: block;
font-size: 1.6rem;
color: #676767;
margin-top:1.5rem;
margin-top: 1.5rem;
line-height: 2.4rem;
}
}
}
}
.marketingAgree{
max-width:54rem;
.payInfoCon{
p{
.marketingAgree {
max-width: 54rem;
.payInfoCon {
p {
text-align: center;
strong{
strong {
display: block;
font-size: 1.6rem;
line-height: 2.4rem;
}
span{
span {
text-align: center;
display: block;
font-size: 1.6rem;
color: #676767;
margin-top:1.5rem;
margin-top: 1.5rem;
line-height: 2.4rem;
}
&.borderWrap{
&.borderWrap {
margin-top: 30px;
padding: 24px;
font-size: 1.4rem;
@@ -123,15 +142,18 @@
}
}
}
&.popInner{
.towButton{
&.popInner {
.towButton {
width: 100%;
}
}
.hideAdCheck{
.hideAdCheck {
text-align: center;
margin-top: 5rem;
label{
label {
display: flex;
width: 100%;
justify-content: center;
@@ -140,64 +162,78 @@
font-size: 1.6rem;
color: #676767;
cursor: pointer;
span{
span {
margin-left: 1rem;
}
}
}
@include maxtablet{
h1{
@include maxtablet {
h1 {
font-size: 1.8rem;
margin-bottom: 1.5rem;
}
.payInfoCon{
p{
.payInfoCon {
p {
font-size: 1.4rem;
&.borderWrap{
&.borderWrap {
padding: 2rem 1rem;
}
}
}
&.popInner{
&.popInner {
padding: 3rem 3rem 4rem;
.towButton{
.towButton {
margin-top: 4rem;
flex-wrap: wrap;
button+button{
button+button {
margin-top: 1rem;
}
}
}
.hideAdCheck{
.hideAdCheck {
margin-top: 4rem;
label{
label {
font-size: 1.4rem;
}
}
}
}
.inquiryCaseEtc{
max-width:54rem;
.inquiryCaseEtcCon{
p{
.inquiryCaseEtc {
max-width: 54rem;
.inquiryCaseEtcCon {
p {
font-size: 1.6rem;
line-height: 2.4rem;
text-align: center;
span{
span {
text-align: center;
display: block;
font-size: 1.6rem;
color: #676767;
margin-top:1.5rem;
margin-top: 1.5rem;
line-height: 2.4rem;
}
}
.linkBox{
.linkBox {
margin-top: 2rem;
padding: 2.8rem;
background-color: #F3F3F3;
text-align: center;
a{
a {
position: relative;
display: inline;
border-bottom: 1px solid #676767;
@@ -206,7 +242,8 @@
font-weight: 400;
line-height: 2.2;
color: #676767;
&:after{
&:after {
content: '';
display: inline-block;
position: absolute;
@@ -217,7 +254,7 @@
background-image: url(/kr/assets/images/kia/svg/icon-link-arrow.svg);
background-repeat: no-repeat;
background-size: 0.6rem 1.2rem;
margin-left:1rem;
margin-left: 1rem;
background-position: center;
}
}
@@ -225,121 +262,148 @@
}
}
&.payComplete{
position: fixed;
overflow: hidden;
}
//설치안내 팝업
.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: absolute;
top: 55%;
left: 50%;
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%;
max-width: 120rem;
height: 90rem;
transform: translateX(-50%);
margin-top: -45rem;
padding: 0;
border-radius: 0;
background: url(../images/kia/contents/poup_complete.jpg) no-repeat center / cover;
.popContents {
position: absolute;
bottom: 10%;
right: 8.333%;
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: 45.5rem;
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;
width: calc(100% - 4rem);
background: url(../images/kia/contents/poup_complete_m.jpg) no-repeat center / cover;
transform: translate(-50%, -50%);
margin-top: 0;
.popContents {
position: absolute;
bottom: 3rem;
right: auto;
width: 100%;
height: auto;
.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;
width: 81.25%;
height: 1.2rem;
margin: 0 auto;
margin-bottom: 1.2rem;
}
.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;
width: 81.25%;
height: 27.7rem;
margin: 0 auto;
&>p {
padding: 0 3rem;
strong {
font-size: 1.8rem;
line-height: 2.16rem;
margin-bottom: 1.6rem;
}
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.4rem;
line-height: 1.68rem;
em {
display: block;
}
span{
font-size: 1.2rem;
line-height: 1.44rem;
em {
display: block;
}
br {
display: none;
}
}
}
.oneButton {
margin-top:4rem;
}
}
}
@media(max-width: 320px){
.popContents {
.payInfoCon {
&>p {
padding: 0 1rem;
}
}
.oneButton {
margin-top: 3rem;
}
}
}
@media(max-width: 320px) {
.popContents {
.payInfoCon {
&>p {
padding: 0 1rem;
}
}
}
}
}
}
}

BIN
assets/images/kia/contents/poup_complete.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 381 KiB

After

Width:  |  Height:  |  Size: 512 KiB

BIN
assets/images/kia/contents/poup_complete_m.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 315 KiB

After

Width:  |  Height:  |  Size: 345 KiB

6
order/order-carsw-complete.html
View File

@@ -434,11 +434,11 @@
<h2 class="logo">Kia Connect Store</h2>
<div class="payInfoCon">
<p>
<strong>커넥트 스토어 상품 구매를 <br>진심으로 축하드립니다~!!!</strong>
<strong>커넥트 스토어 상품 구매를 <br>진심으로 축하드립니다.</strong>
<span>
<em>지금 바로 새로운 기능을 추가하여</em> 더욱 안전하고 <br>즐거운 드라이빙을 해보세요!!
<em>지금 바로 새로운 기능을</em> <em>추가하여 더욱 안전하고</em> <br>즐거운 드라이빙을 해보세요!!
</span>
</p>
</p>
<div>
<div class="oneButton">
<a href="javascript:;" onClick="javascript:close_layer_popup('pay_complete');"><p>확인</p></a>

28
order/order-carsw-complete.php
View File

@@ -228,22 +228,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 class="popContents">
<h2 class="logo">Kia Connect Store</h2>
<div class="payInfoCon">
<p>
<strong>커넥트 스토어 상품 구매를 <br>진심으로 축하드립니다.</strong>
<span>
<em>지금 바로 새로운 기능을</em> <em>추가하여 더욱 안전하고</em> <br>즐거운 드라이빙을 해보세요!!
</span>
</p>
<div>
<div class="oneButton">
<a href="javascript:;" onClick="javascript:close_layer_popup('pay_complete');"><p>확인</p></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>