2 changed files with 104 additions and 1 deletions
@ -1,2 +1,21 @@ |
|||
<view class="page-bg"> |
|||
<view class="login-copy-content"> |
|||
<image class="login-copy-style" mode="aspectFill" src="https://common-1257637852.cos.ap-guangzhou.myqcloud.com/paidui-pay/login-copy.png"></image> |
|||
</view> |
|||
<view class="input-mobile-phone"> |
|||
<input class="phone-input" bindinput= "" name="phone" placeholder="请输入手机号" value="" /> |
|||
</view> |
|||
<view class="input-validation"> |
|||
<input class="mobile-verification" bindinput= "" name="phone" placeholder="请输入短信验证码" value="" /> |
|||
<button class="verification-button">获取验证码</button> |
|||
</view> |
|||
<button class="login-button">登 录</button> |
|||
<view class="consent-agreement"> |
|||
<view class="radio-style" bindtap='checkedTap'> |
|||
<radio checked="{{checked1}}"></radio> |
|||
</view> |
|||
<span class="agree-style">我同意</span> |
|||
<span class="orangeColor" catchtap="readFile" data-url="" data-txt="使用条款">《排队支付用户服务协议》</span> |
|||
<span class="orangeColor" catchtap="readFile" data-url="" data-txt="隐私政策">《隐私保护协议》</span> |
|||
</view> |
|||
</view> |
|||
@ -1,4 +1,88 @@ |
|||
page{ |
|||
background: #f7f7f7; |
|||
background: #fff; |
|||
} |
|||
.page-bg{ |
|||
width: 750rpx; |
|||
height: 1492rpx; |
|||
background: url("https://common-1257637852.cos.ap-guangzhou.myqcloud.com/paidui-pay/Login-bg.png") no-repeat center center; |
|||
background-size:cover; |
|||
padding: 0 30rpx; |
|||
} |
|||
image.login-copy-style{ |
|||
width: 364rpx; |
|||
height: 200rpx; |
|||
background-size:cover; |
|||
margin: 90rpx 0; |
|||
} |
|||
.input-mobile-phone{ |
|||
display: flex; |
|||
justify-content: left; |
|||
align-items: center; |
|||
width: 690rpx; |
|||
height: 88rpx; |
|||
background: #fff; |
|||
border-radius: 100rpx; |
|||
padding: 0 40rpx; |
|||
margin-bottom: 40rpx; |
|||
} |
|||
input.phone-input{ |
|||
width: 690rpx; |
|||
font-family: "Microsoft YaHei"; |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
} |
|||
.input-validation{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
width: 690rpx; |
|||
height: 88rpx; |
|||
background: #fff; |
|||
border-radius: 100rpx; |
|||
padding: 0 40rpx; |
|||
margin-bottom: 40rpx; |
|||
} |
|||
input.mobile-verification{ |
|||
width: 400rpx; |
|||
font-family: "Microsoft YaHei"; |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
} |
|||
button.verification-button{ |
|||
font-family: "Microsoft YaHei"; |
|||
font-size: 24rpx; |
|||
color: #454545; |
|||
background: none; |
|||
border-radius: 100rpx; |
|||
border: 1rpx solid #fff; |
|||
margin: 0; |
|||
} |
|||
button{ |
|||
border: none; |
|||
} |
|||
button.login-button{ |
|||
width: 690rpx; |
|||
height: 88rpx; |
|||
line-height: 88rpx; |
|||
font-family: "Microsoft YaHei"; |
|||
font-size: 30rpx; |
|||
color: #fff; |
|||
font-weight: bold; |
|||
background: #F52F3E; |
|||
border-radius: 100rpx; |
|||
margin-top: 90rpx; |
|||
border: none; |
|||
} |
|||
.consent-agreement{ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
margin-top: 36rpx; |
|||
} |
|||
.agree-style{ |
|||
font-family: "Microsoft YaHei"; |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue