You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
545 lines
12 KiB
545 lines
12 KiB
@charset "UTF-8"; |
|
header { |
|
z-index: 101 !important; |
|
} |
|
|
|
body, |
|
.mui-content { |
|
background: #FFFFFF; |
|
position: relative; |
|
z-index: 100; |
|
} |
|
|
|
//顶部信息样式 |
|
.top-info { |
|
position: relative; |
|
span { |
|
width: 100%; |
|
color: #333333; |
|
display: block; |
|
padding: .1rem .3rem; |
|
font-size: .43rem; |
|
} |
|
.countdown { |
|
position: absolute; |
|
right: .2rem; |
|
top: .5rem; |
|
color: #73D13D; |
|
} |
|
.mui-icon-right-nav { |
|
position: absolute; |
|
right: .2rem; |
|
top: .1rem; |
|
img { |
|
width: .3rem; |
|
height: .3rem; |
|
vertical-align: middle; |
|
} |
|
label { |
|
font-size: .24rem; |
|
padding-left: .1rem; |
|
color: #D43436; |
|
} |
|
} |
|
} |
|
|
|
//已付款页面的顶部信息样式 |
|
.had-top-info { |
|
text-align: center; |
|
span { |
|
display: block; |
|
margin: .1rem 0; |
|
} |
|
.money { |
|
font-size: .37rem; |
|
color: #4B557D; |
|
} |
|
.anti-money { |
|
color: #333333; |
|
} |
|
.pay-time { |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
.countdown { |
|
color: #73D13D; |
|
margin-left: .2rem; |
|
} |
|
.mui-icon-right-nav { |
|
img { |
|
width: .3rem; |
|
height: .3rem; |
|
vertical-align: middle; |
|
} |
|
label { |
|
font-size: .24rem; |
|
padding-left: .1rem; |
|
color: #D43436; |
|
} |
|
} |
|
} |
|
} |
|
|
|
//选择切换方式 |
|
.mui-card { |
|
background: rgba(255, 255, 255, 1); |
|
box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1); |
|
border-radius: 5px; |
|
margin: .5rem .3rem .1rem .3rem; |
|
.mui-checkbox input[type=checkbox], |
|
.mui-radio input[type=radio] { |
|
top: 11px; |
|
&:checked:before { |
|
// content: '√'; |
|
color: #D7393E; |
|
} |
|
} |
|
.mui-input-row { |
|
display: flex; |
|
align-items: center; |
|
height: .86rem; |
|
} |
|
img { |
|
width: .4rem; |
|
height: .4rem; |
|
margin-left: .2rem; |
|
} |
|
} |
|
|
|
.info-box { |
|
span { |
|
width: 100%; |
|
color: #A0A5AD; |
|
display: block; |
|
padding: .1rem .3rem; |
|
.person-name { |
|
color: #D43436; |
|
font-size: .24rem; |
|
} |
|
label { |
|
color: #484860; |
|
font-size: .23rem; |
|
padding-left: .3rem; |
|
float: right; |
|
img { |
|
width: .26rem; |
|
height: .3rem; |
|
vertical-align: text-bottom; |
|
margin-left: .2rem; |
|
} |
|
} |
|
} |
|
} |
|
|
|
//已付款的详细样式 |
|
.had-info-box { |
|
width: 92%; |
|
margin: .4rem auto; |
|
background: rgba(251, 251, 251, 1); |
|
border-radius: 2px; |
|
padding: .1rem 0; |
|
font-size: .2rem; |
|
span { |
|
width: 100%; |
|
color: #A0A5AD; |
|
display: block; |
|
padding: .1rem .2rem; |
|
label { |
|
color: #484860; |
|
float: right; |
|
img { |
|
width: .26rem; |
|
height: .3rem; |
|
vertical-align: text-bottom; |
|
margin-left: .2rem; |
|
} |
|
} |
|
} |
|
.info-box-title { |
|
font-size: .24rem; |
|
img { |
|
width: .4rem; |
|
height: .4rem; |
|
vertical-align: middle; |
|
margin-right: .2rem; |
|
} |
|
label { |
|
color: #D43436; |
|
} |
|
} |
|
} |
|
|
|
//.payment { |
|
// margin-top: .2rem; |
|
// .mui-icon { |
|
// font-size: .3rem; |
|
// label { |
|
// font-size: .24rem; |
|
// padding-left: .1rem; |
|
// } |
|
// } |
|
// .mui-table-view:before, |
|
// .mui-table-view:after { |
|
// height: 0; |
|
// } |
|
// .mui-table-view-cell { |
|
// &:first-child { |
|
// border: 1px solid #EEEEEE; |
|
// } |
|
// &:after { |
|
// height: 0; |
|
// } |
|
// .payment-txt { |
|
// display: inline; |
|
// color: #999999; |
|
// } |
|
// label { |
|
// float: right; |
|
// margin-right: .3rem; |
|
// color: #333333; |
|
// img { |
|
// width: .26rem; |
|
// height: .3rem; |
|
// vertical-align: text-bottom; |
|
// margin-left: .2rem; |
|
// } |
|
// } |
|
// .switth { |
|
// color: #999999; |
|
// } |
|
// } |
|
//} |
|
.notice { |
|
margin-bottom: 1rem; |
|
.mui-table-view { |
|
.mui-table-view-cell { |
|
.mui-active { |
|
background: rgba(216, 216, 216, 1); |
|
} |
|
padding: .1rem .3rem; |
|
} |
|
&:before, |
|
&:after { |
|
height: 0; |
|
} |
|
} |
|
p { |
|
color: #A0A5AD; |
|
} |
|
a { |
|
display: block; |
|
height: 1rem; |
|
background: rgba(216, 216, 216, 1); |
|
border-radius: 3px; |
|
color: #A0A5AD; |
|
opacity: 0.2; |
|
margin: .1rem 0 !important; |
|
word-break:break-all; |
|
white-space:normal !important; |
|
overflow: scroll !important; |
|
} |
|
} |
|
|
|
//.mui-table-view-cell a.mui-active { |
|
// background: none !important; |
|
//} |
|
//按鈕樣式 |
|
.btn-group { |
|
width: 100%; |
|
display: flex; |
|
position: fixed; |
|
bottom: 0; |
|
box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1); |
|
.chat-btn { |
|
width: 1.29rem; |
|
height: .84rem; |
|
text-align: center; |
|
line-height: .9rem; |
|
img { |
|
width: .4rem; |
|
height: .4rem; |
|
} |
|
} |
|
.cancel-btn, |
|
.yes-btn { |
|
flex: 1; |
|
height: .84rem; |
|
background: #FBEBEB; |
|
text-align: center; |
|
color: #D43436; |
|
font-size: .27rem; |
|
line-height: .84rem; |
|
} |
|
.yes-btn { |
|
background: #D43436; |
|
color: #FFFFFF; |
|
} |
|
} |
|
|
|
//已付款按鈕樣式 |
|
.hadbtn-group { |
|
margin-top: 2rem; |
|
.hadpay-btn { |
|
width: 92%; |
|
height: .8rem; |
|
background: #D43436; |
|
color: #FFFFFF; |
|
text-align: center; |
|
line-height: .8rem; |
|
margin: 0 auto; |
|
} |
|
} |
|
|
|
//取消订单弹出框 |
|
.cancelOrder { |
|
width: 90%; |
|
height: 3.58rem; |
|
display: none; |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
margin-left: -45%; |
|
margin-top: -1.79rem; |
|
z-index: 111; |
|
.orderCont { |
|
width: 100%; |
|
background-color: #fff; |
|
overflow: hidden; |
|
padding: 0.3rem 0 0 0.3rem; |
|
border-radius: 0.1rem 0.1rem 0 0; |
|
.popText_1 { |
|
font-size: 0.28rem; |
|
color: #F96B6B; |
|
margin-top: 0.49rem; |
|
} |
|
.popText_2 { |
|
font-size: 0.24rem; |
|
color: #666; |
|
margin-top: 0.36rem; |
|
margin-bottom: 0.5rem; |
|
} |
|
} |
|
.orderHandle { |
|
width: 100%; |
|
height: 0.98rem; |
|
display: flex; |
|
border-top: 0.01rem solid #EEEEEE; |
|
margin-top: -1px; |
|
.thinkBtn { |
|
color: #999; |
|
background-color: #fff; |
|
border-radius: 0 0 0 0.1rem; |
|
} |
|
.cancelBtn { |
|
color: #fff; |
|
background: linear-gradient(-90deg, rgba(212, 52, 54, 1), rgba(255, 146, 125, 1)); |
|
border-radius: 0 0 0.1rem 0; |
|
} |
|
} |
|
.popTitle { |
|
font-size: 0.32rem; |
|
color: #000; |
|
} |
|
.popText { |
|
width: 92%; |
|
text-align: justify; |
|
line-height: 0.41rem; |
|
} |
|
.btn { |
|
width: 50%; |
|
line-height: 0.98rem; |
|
text-align: center; |
|
font-size: 0.32rem; |
|
} |
|
} |
|
|
|
//蒙版背景 |
|
.bg { |
|
position: fixed; |
|
left: 0; |
|
bottom: 0; |
|
right: 0; |
|
top: 0; |
|
background: rgba(21, 33, 54, 0.2); |
|
z-index: 102; |
|
// display: none; |
|
} |
|
|
|
//二维码弹出框样式 |
|
.code { |
|
width: 4rem; |
|
height: 4rem; |
|
display: none; |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
margin-left: -2rem; |
|
margin-top: -2rem; |
|
text-align: center; |
|
z-index: 111; |
|
background: #FFFFFF; |
|
padding: .2rem; |
|
box-sizing: border-box; |
|
img { |
|
height: 3rem; |
|
display: inline-block; |
|
max-width: 100%; |
|
} |
|
span { |
|
display: block; |
|
font-size: .5rem; |
|
font-weight: 500; |
|
} |
|
} |
|
|
|
//<!--买入卖出交易密码确认样式--> |
|
.confirm { |
|
width: 5.42rem; |
|
height: 3.54rem; |
|
border-radius: 4px; |
|
position: fixed; |
|
left: 50%; |
|
top: 50%; |
|
margin-left: -2.71rem; |
|
margin-top: -1.77rem; |
|
background: #FFFFFF; |
|
border-radius: .2rem; |
|
z-index: 110; |
|
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; |
|
.input-group { |
|
position: relative; |
|
text-align: center; |
|
overflow: hidden; |
|
.title-top { |
|
height: .8rem; |
|
border-bottom: 1px solid #F1F1F1; |
|
} |
|
.icon { |
|
position: absolute; |
|
left: .1rem; |
|
padding-top: .2rem; |
|
color: #333333; |
|
} |
|
.title { |
|
display: inline-block; |
|
width: 100%; |
|
padding-top: .2rem; |
|
color: #333333; |
|
} |
|
.mui-input-row { |
|
padding: 0 .3rem; |
|
margin-top: .4rem; |
|
label { |
|
font-size: .24rem; |
|
font-weight: 400; |
|
color: #333333; |
|
text-align: left; |
|
padding: 0; |
|
margin-bottom: .17rem; |
|
} |
|
.mui-input-password { |
|
width: 100%; |
|
height: .6rem; |
|
border: none; |
|
background-color: #F1F1F1; |
|
color: #333333; |
|
padding-left: .2rem; |
|
&::-webkit-input-placeholder { |
|
font-size: .22rem; |
|
font-weight: 400; |
|
color: #999999; |
|
} |
|
} |
|
.mui-icon-eye { |
|
top: .5rem; |
|
right: .29rem; |
|
} |
|
} |
|
.mui-button-row { |
|
button { |
|
width: 89%; |
|
height: .6rem; |
|
background: #D43436; |
|
border-radius: 4px; |
|
border: 1px solid #D43436; |
|
margin-top: .2rem; |
|
} |
|
} |
|
} |
|
} |
|
|
|
//底部弹出框 |
|
#popover { |
|
background: #FFFFFF; |
|
width: 100%; |
|
height: 10rem; |
|
border-radius: .2rem .2rem 0 0; |
|
position: fixed; |
|
z-index: 1000; |
|
top: 100px; |
|
.popover-info { |
|
border-bottom:1px solid #EEEEEE; |
|
.info-txt { |
|
display: flex; |
|
align-items: center; |
|
padding: .3rem .3rem .2rem .3rem; |
|
.img-box { |
|
width: .5rem; |
|
height: .5rem; |
|
border-radius: 50%; |
|
overflow: hidden; |
|
img { |
|
width: .5rem; |
|
height: .5rem; |
|
} |
|
} |
|
h4 { |
|
flex: 1; |
|
color: #333333; |
|
font-size: .31rem; |
|
padding-left: .2rem; |
|
} |
|
p { |
|
flex: 1; |
|
color: #999999; |
|
text-align: right; |
|
} |
|
} |
|
} |
|
.money-info { |
|
display: flex; |
|
justify-content: space-between; |
|
padding: 0 .3rem; |
|
.money-info-left { |
|
.money-info-txt { |
|
color: #9DA6B3; |
|
display: block; |
|
} |
|
.money-info-num { |
|
color: #D7393E; |
|
font-size: .3rem; |
|
display: block; |
|
padding-top: .1rem; |
|
} |
|
} |
|
.money-info-right { |
|
.money-info-txt { |
|
display: flex; |
|
align-items: center; |
|
color: #73D13D; |
|
img { |
|
width: .3rem; |
|
height: .3rem; |
|
vertical-align: middle; |
|
margin-right: .1rem; |
|
} |
|
} |
|
.money-info-num { |
|
color: #D7393E; |
|
font-size: .3rem; |
|
display: block; |
|
text-align: right; |
|
} |
|
} |
|
} |
|
} |