2023/07/07 결제하기, 이벤트페이지 수정
@e71cc2086c8d3a60837b41dc591bc949878bcbc6
--- src/main/webapp/publish/css/content.css
+++ src/main/webapp/publish/css/content.css
... | ... | @@ -1075,18 +1075,22 @@ |
| 1075 | 1075 |
.charg_cont.current {display: block;}
|
| 1076 | 1076 |
.charg_cont .tab_tit{font-size: 24px; font-weight: bold; color: #222; margin-bottom: 20px; margin-top: 40px;}
|
| 1077 | 1077 |
.charg_cont .area_tab{display: flex; width: 100%; justify-content: space-between;}
|
| 1078 |
-.charg_cont .area_tab li{ width: calc((100% - 80px)/5); border: 1px solid #ddd; border-radius: 5px; position: relative; box-sizing: border-box; text-align: center;}
|
|
| 1078 |
+/* 간편결제 오픈 시 |
|
| 1079 |
+.charg_cont .area_tab li{ width: calc((100% - 80px)/5); border: 1px solid #ddd; border-radius: 5px; position: relative; box-sizing: border-box; text-align: center;} */
|
|
| 1080 |
+.charg_cont .area_tab li{ width: calc((100% - 80px)/4); border: 1px solid #ddd; border-radius: 5px; position: relative; box-sizing: border-box; text-align: center;}
|
|
| 1079 | 1081 |
.charg_cont .area_tab li button {font-size: 22px; font-weight: 400; width: 100%; height: 100%; padding: 60px 20px 40px 20px;position:relative;z-index:1;}
|
| 1080 | 1082 |
.charg_cont .area_tab li.active {border: 3px solid #fbc72b;}
|
| 1081 | 1083 |
.charg_cont .area_tab li.active::before{background-image: url(/publish/images/content/icon_chargeCheck2.png); background-color: #fbc72b; border: 2px solid #fbc72b;}
|
| 1082 | 1084 |
.charg_cont .area_tab li::before{position: absolute; content: " "; width: 31px; height: 31px; border: 3px solid #ccc; right: 15px; top: 15px; border-radius: 100%; background-image: url(/publish/images/content/icon_chargeCheck1.png); background-repeat: no-repeat; background-position: center 58%;}
|
| 1083 | 1085 |
.charg_cont .area_tab button i{width: 65px; height: 55px; display: block; margin: 0 auto 15px auto; background-position: center;}
|
| 1084 |
-.charg_cont .area_tab .btn_charge1 i{background-image: url(/publish/images/simple.png);}
|
|
| 1085 |
-.charg_cont .area_tab .btn_charge2 i{background-image: url(/publish/images/content/icon_charging2.png);}
|
|
| 1086 |
-.charg_cont .area_tab .btn_charge3 i{background-image: url(/publish/images/content/icon_charging3.png);}
|
|
| 1086 |
+.charg_cont .area_tab .btn_charge_simple i{background-image: url(/publish/images/simple.png);}
|
|
| 1087 |
+.charg_cont .area_tab .btn_charge1 i{background-image: url(/publish/images/content/icon_charging2.png);}
|
|
| 1088 |
+.charg_cont .area_tab .btn_charge2 i{background-image: url(/publish/images/content/icon_charging3.png);}
|
|
| 1087 | 1089 |
.charg_cont .area_tab .btn_charge4 i{background-image: url(/publish/images/content/icon_charging4.png);}
|
| 1088 | 1090 |
.charg_cont .area_tab .btn_charge5 i{background-image: url(/publish/images/content/icon_charging5.png);}
|
| 1089 | 1091 |
.charg_cont .area_tab+.checkbox_wrap{margin-top: 18px; color: #666; font-weight: 300; font-size: 18px; text-align: right; width: 100%;}
|
| 1092 |
+/* 간편결제 오픈 시 |
|
| 1093 |
+.charg_cont .area_tab.type03 li {width:calc(100%/4 - 15px);} */
|
|
| 1090 | 1094 |
.charg_cont .area_tab.type03 li {width:calc(100%/3 - 15px);}
|
| 1091 | 1095 |
.charg_cont .checkbox_wrap input[type="checkbox"], |
| 1092 | 1096 |
.charg_cont .checkbox_wrap input[type="radio"]{display: none;}
|
--- src/main/webapp/publish/firstpay_event2.html
+++ src/main/webapp/publish/firstpay_event2.html
... | ... | @@ -284,26 +284,24 @@ |
| 284 | 284 |
<div> |
| 285 | 285 |
<p class="tab_tit">충전수단 선택</p> |
| 286 | 286 |
<ul class="area_tab"> |
| 287 |
- <li class="btn_charge1 btn_tab active"><button type="button" |
|
| 288 |
- onclick="TabTypePay(this,'1');"><i></i>신용카드</button></li> |
|
| 289 |
- <li class="btn_charge2 btn_tab"><button type="button" |
|
| 290 |
- onclick="TabTypePay(this,'2');" |
|
| 291 |
- id="btnDdedicatedAccount"><i></i>전용계좌</button></li> |
|
| 287 |
+ <li class="btn_charge_simple btn_tab active"> |
|
| 288 |
+ <button type="button" onclick="TabTypePay(this,'1');"><i></i>간편결제</button> |
|
| 289 |
+ </li> |
|
| 290 |
+ <li class="btn_charge1 btn_tab"> |
|
| 291 |
+ <button type="button" onclick="TabTypePay(this,'1');"><i></i>신용카드</button> |
|
| 292 |
+ </li> |
|
| 293 |
+ <li class="btn_charge2 btn_tab"> |
|
| 294 |
+ <button type="button" onclick="TabTypePay(this,'2');" id="btnDdedicatedAccount"><i></i>전용계좌</button> |
|
| 295 |
+ </li> |
|
| 292 | 296 |
<!-- <li class="btn_charge2 btn_tab"><button type="button" onclick="TabTypePay(this,'3');"><i></i>무통장입금</button></li> --> |
| 293 |
- <li class="btn_charge4 btn_tab"><button type="button" |
|
| 294 |
- onclick="TabTypePay(this,'4');"><i></i>휴대폰결제</button></li> |
|
| 295 |
- <li class="btn_charge5 btn_tab"><button type="button" |
|
| 296 |
- onclick="TabTypePay(this,'5');"><i></i>즉시이체</button></li> |
|
| 297 |
+ <!-- <li class="btn_charge4 btn_tab"><button type="button" onclick="TabTypePay(this,'4');"><i></i>휴대폰결제</button></li> --> |
|
| 298 |
+ <li class="btn_charge5 btn_tab"><button type="button" onclick="TabTypePay(this,'5');"><i></i>즉시이체</button></li> |
|
| 297 | 299 |
</ul> |
| 298 |
- <div class="checkbox_wrap"><input type="checkbox" id="agree"><label |
|
| 299 |
- for="agree">선택한 수단을 다음 충전 시에도 |
|
| 300 |
- 이용합니다.</label></div> |
|
| 300 |
+ <div class="checkbox_wrap"><input type="checkbox" id="agree"><label for="agree">선택한 수단을 다음 충전 시에도 이용합니다.</label></div> |
|
| 301 | 301 |
|
| 302 | 302 |
<!-- 신용카드 --> |
| 303 | 303 |
<div class="area_tabcont on" id="tab2_1"> |
| 304 |
- <p class="tType1_title"><img |
|
| 305 |
- src="/publish/images/content/icon_charging1_small.png" |
|
| 306 |
- alt=""> 신용카드</p> |
|
| 304 |
+ <p class="tType1_title"><img src="/publish/images/content/icon_charging1_small.png" alt=""> 신용카드</p> |
|
| 307 | 305 |
<table class="tType1"> |
| 308 | 306 |
<caption></caption> |
| 309 | 307 |
<colgroup> |
... | ... | @@ -314,8 +312,7 @@ |
| 314 | 312 |
<tr class="charge_content"> |
| 315 | 313 |
<th scope="row">충전금액</th> |
| 316 | 314 |
<td class="flex"> |
| 317 |
- <select name="tempPrice" id="tempPrice" |
|
| 318 |
- class="list_seType1"> |
|
| 315 |
+ <select name="tempPrice" id="tempPrice" class="list_seType1"> |
|
| 319 | 316 |
<option value="5000">5,000</option> |
| 320 | 317 |
<option value="10000">10,000</option> |
| 321 | 318 |
<option value="20000">20,000</option> |
--- src/main/webapp/publish/guide_2022.html
+++ src/main/webapp/publish/guide_2022.html
... | ... | @@ -18,12 +18,12 @@ |
| 18 | 18 |
<!-- <p>***<span class="font1"> (컨텐츠)</span> : 반복적으로 사용 안함</p> |
| 19 | 19 |
<p>***<span class="font2"> (보드)</span> : 반복적으로 사용</p> --> |
| 20 | 20 |
<ul class="page"> |
| 21 |
+ <li><a href="/publish/payment2.html">payment2.html</a>결제관리 > 결제하기 > 충전수단 선택 > 간편결제추가 + 등급별금액&누적결제액별 등급 및 단가(테이블 및 텍스트 추가)</li> |
|
| 22 |
+ <li><a href="/publish/firstpay_event2.html">firstpay_event2.html</a>고객센터 > 이벤트페이지 > 충전수단 선택 내용 추가 </li> |
|
| 21 | 23 |
<li><a href="/publish/index_2023.html">index_2023.html</a>로그인 바 > 등급별 아이콘 이미지 추가 + 홍길동(개인)으로 이름 변경 (님)자 제거 + 요금안내 페이지 이동 탑 배너 추가 + 퀵메뉴 > 맞춤제작을 요금안내로 변경</li> |
| 22 | 24 |
<li><a href="/publish/mypage_index_2023.html">mypage_index_2023.html</a>마이페이지 > 등급별 아이콘 버튼 추가 + 등급별 아이콘 버튼 클릭 > 팝업추가</li> |
| 23 |
- <li><a href="/publish/firstpay_event.html">firstpay_event.html</a>고객센터 > 이벤트페이지 > 충전수단 선택 내용 추가 </li> |
|
| 24 | 25 |
<li><a href="/publish/payment3.html">payment3.html</a>결제관리 > 요금결제내역 > 간편결제 결제내역 tap추가 + 등급 및 누적결제액 확인 버튼 추가 + 등급 및 누적결제액 확인 버튼 클릭 > 팝업추가</li> |
| 25 | 26 |
<li><a href="/publish/sub1_2023.html">sub1_2023.html</a>문자발송 > 문자전송 > 발송금액 > 나의단가 금액 추가</li> |
| 26 |
- <li><a href="/publish/payment2.html">payment2.html</a>결제관리 > 결제하기 > 충전수단 선택 > 간편결제추가 + 등급별금액&누적결제액별 등급 및 단가(테이블 및 텍스트 추가)</li> |
|
| 27 | 27 |
<li><a href="/publish/payment1.html">payment1.html</a>결제관리 > 요금안내/견적안내(테이블 및 텍스트 추가)</li> |
| 28 | 28 |
<li><a href="/publish/kakao_allimtalk_intro.html">kakao_allimtalk_intro.html</a>카카오톡 소개</li> |
| 29 | 29 |
<li><a href="/publish/popup_pay_complete.html">popup_pay_complete.html</a>결제완료 팝업</li> |
--- src/main/webapp/publish/payment2.html
+++ src/main/webapp/publish/payment2.html
... | ... | @@ -23,7 +23,10 @@ |
| 23 | 23 |
<script src="/publish/js/calendar.js"></script> |
| 24 | 24 |
<script src="/publish/js/popupLayer.js"></script> |
| 25 | 25 |
|
| 26 |
- |
|
| 26 |
+ <style> |
|
| 27 |
+ .charg_cont .area_tab li{ width: calc((100% - 80px)/5);}
|
|
| 28 |
+ </style> |
|
| 29 |
+ |
|
| 27 | 30 |
</head> |
| 28 | 31 |
|
| 29 | 32 |
<body> |
... | ... | @@ -214,10 +217,10 @@ |
| 214 | 217 |
<div> |
| 215 | 218 |
<p class="tab_tit">충전수단 선택</p> |
| 216 | 219 |
<ul class="area_tab"> |
| 217 |
- <li class="btn_charge1 btn_tab active"><button onclick="TabType2(this,'1');"><i></i>간편결제</button></li> |
|
| 218 |
- <li class="btn_charge2 btn_tab"><button onclick="TabType2(this,'2');"><i></i>신용카드</button> |
|
| 220 |
+ <li class="btn_charge_simple btn_tab active"><button onclick="TabType2(this,'1');"><i></i>간편결제</button></li> |
|
| 221 |
+ <li class="btn_charge1 btn_tab"><button onclick="TabType2(this,'2');"><i></i>신용카드</button> |
|
| 219 | 222 |
</li> |
| 220 |
- <li class="btn_charge3 btn_tab"><button onclick="TabType2(this,'3');"><i></i>전용계좌</button> |
|
| 223 |
+ <li class="btn_charge2 btn_tab"><button onclick="TabType2(this,'3');"><i></i>전용계좌</button> |
|
| 221 | 224 |
</li> |
| 222 | 225 |
<!-- <li class="btn_charge2 btn_tab"><button onclick="TabType2(this,'3');"><i></i>무통장입금</button></li> --> |
| 223 | 226 |
<li class="btn_charge4 btn_tab"><button onclick="TabType2(this,'4');"><i></i>휴대폰결제</button> |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?