diff --git a/src/main/ui/static/images/Bitmap_payment.png b/src/main/ui/static/images/Bitmap_payment.png new file mode 100644 index 000000000..2a7e36c73 Binary files /dev/null and b/src/main/ui/static/images/Bitmap_payment.png differ diff --git a/src/main/ui/static/templates/payment/v4/payment.css b/src/main/ui/static/templates/payment/v4/payment.css index c8d95f23d..45b7dd950 100644 --- a/src/main/ui/static/templates/payment/v4/payment.css +++ b/src/main/ui/static/templates/payment/v4/payment.css @@ -1,21 +1,22 @@ .header-banner { - background:url(/static/images/pay_v4_banner.png) no-repeat; + background: url(/static/images/pay_v4_banner.png) no-repeat; background-size: 92% 100%; background-position: center; - box-shadow:0 0 10px #dddddd inset; + box-shadow: 0 0 10px #dddddd inset; } -.merchant-title{ +.merchant-title { font-family: PingFang-SC-Medium; font-size: 13px; color: #FFFFFF; letter-spacing: 0; } -.line{ +.line { margin-top: 15px; margin-bottom: 15px; } + body { -webkit-touch-callout: auto; -webkit-user-select: auto; @@ -30,12 +31,14 @@ body { div, span, p, ul, li { box-sizing: border-box; } -.warning-sm{ - color:red; - font-size:10px; + +.warning-sm { + color: red; + font-size: 10px; transform-origin: left; transform: scale(0.8); } + .weui_grid { padding: 7px; height: 53px; @@ -173,27 +176,29 @@ input.value:focus { } .new_year { - width:100%; - height:100%; - position:absolute; - top:18%; - left:0; - z-index:-1; + width: 100%; + height: 100%; + position: absolute; + top: 18%; + left: 0; + z-index: -1; border-radius: 0 0 25px 25px; } + .bankpay { text-align: center; padding: 20px; color: #FFFFFF; } -@media screen and (max-height: 520px){ +@media screen and (max-height: 520px) { .bankpay { text-align: center; padding: 0; color: #FFFFFF; } } + .row { width: 100%; padding: 0 30px; @@ -266,7 +271,7 @@ input.value:focus { } -@media screen and (max-height:670px){ +@media screen and (max-height: 670px) { .currencyrow { box-sizing: border-box; margin-top: 0; @@ -275,7 +280,7 @@ input.value:focus { } } -@media screen and (max-height: 520px){ +@media screen and (max-height: 520px) { .currencyrow { box-sizing: border-box; margin-top: 20px; @@ -466,8 +471,9 @@ input.value:focus { #coupon-box-toggle { padding: 0 20px; margin-bottom: 10px; + margin-top: 15px; text-align: right; - color: #30af69; + color: #FF7E28; font-size: 12px; cursor: pointer; } @@ -492,7 +498,7 @@ input.value:focus { display: none; } -.coupons-container.show{ +.coupons-container.show { display: block; } @@ -517,7 +523,7 @@ input.value:focus { transform: translate(-50%, -50%); } -.coupons-container .coupon-box-title{ +.coupons-container .coupon-box-title { width: 100%; display: block; background: #fff; @@ -526,19 +532,19 @@ input.value:focus { border-bottom: 1px solid #d0d0d0; } -.coupons-container .coupon-box-title:after{ +.coupons-container .coupon-box-title:after { content: ''; display: block; clear: both; } -.coupons-container .coupon-box-title>.title{ +.coupons-container .coupon-box-title > .title { float: left; display: block; - color: #0BB20C; + color: #FF7E28; } -.coupons-container .coupon-box-title>#close-coupon-box{ +.coupons-container .coupon-box-title > #close-coupon-box { color: #700; float: right; display: block; @@ -546,12 +552,12 @@ input.value:focus { } -.actCharity-red{ +.actCharity-red { color: #FB5252; display: inline; } -.actCharity{ +.actCharity { display: inline; font-family: PingFang-SC-Medium; font-size: 13px; @@ -571,12 +577,30 @@ input.value:focus { -webkit-appearance: none; } +.remark-textarea-new { + box-shadow: none; + font-size: 13px; + width: calc(100% - 40px); + margin: 0 20px; + padding: 10px 0; + height: 18px; + border: 1px solid #FBF9FE; + border-bottom-color: #BCBCBC; + -webkit-appearance: none; + background-color: #FBF9FE; +} + +.remark-textarea-new::-webkit-input-placeholder { + font-size: 13px; + color: #BCBCBC; +} + .remark-textarea::-webkit-input-placeholder { font-size: 13px; color: #BCBCBC; } -.paynow-button{ +.paynow-button { background: #19AD18; border: 1px solid #179B16; border-radius: 3px; @@ -592,7 +616,7 @@ input.value:focus { margin-top: 31px; } -.bankpay-button{ +.bankpay-button { border: 1px solid #FF6600; border-radius: 3px; font-size: 16px; @@ -605,7 +629,7 @@ input.value:focus { background-color: white; } -#coupon-box-toggle.canUse-coupon{ +#coupon-box-toggle.canUse-coupon { padding: 0 30px; margin-bottom: 10px; text-align: right; @@ -614,7 +638,8 @@ input.value:focus { cursor: pointer; margin: 11px; } -input::-webkit-input-placeholder{ + +input::-webkit-input-placeholder { font-size: 50px; color: #FFFFFF; line-height: 60px; @@ -628,8 +653,18 @@ input::-webkit-input-placeholder{ padding-top: 10px; } -.merchant-div{ +.merchant-div { display: inline-block; padding-left: 10px; padding-top: 20px; } + +.advertisement { + display: flex; + justify-content: center; + margin-top: 10px; +} + +.arrow-color { + color: #FF7E28; +}