chenchao / YOHOBUYPC · Commits

Go to a project

Authored by 毕凯
Commit 27be89ebd2dfe83390c5b92a9598fab912887e93 1 parent 59f09d94

登录页面 bind

Inline Side-by-side
Showing 8 changed files with 401 additions and 1 deletions
... ... @@ -180,8 +180,8 @@ a {
@import "filter";
@import "loading";
@import "index/index";
/*
@import "passport/index";
/*
@import "guang/index";
@import "home/index";
@import "category/index";
... ...
.back-email-success-page {
.tip {
font-size: 40px;
color: #fff;
margin-top: 60px;
}
.sub-tip, .resend {
color: #939393;
font-size: 32px;
}
.go-email {
margin: 40px 0 20px;
}
.resend {
float: right;
}
}
... ...
.bind-page
.bind-tip {
color: #fff;
font-size: 30px;
}
#yohood {
background-image: resolve('yohood.png');
background-size: 40%;
background-repeat: no-repeat;
background-color: transparent;
background-position-x: 10%;
background-position-y: 40%;
border: none;
border-bottom: 8px solid #fff;
}
... ...
.reg-code-page, .back-code-page {
.captcha-tip {
position: absolute;
width: 298px;
text-align: center;
right: 30px;
top: 16px;
color: #36a74c;
padding: 10px 0;
border: 1px solid #36a74c;
border-radius: 40px;
font-size: 32px;
&.disable {
color: #8f8f8f;
border-color: #8f8f8f;
}
}
.input-container {
padding-right: 380px;
}
.text-container {
color: #fff;
font-size: 32px;
margin-bottom: 40px;
}
.phone {
color: #4ecae8;
}
.clear-input {
right: 340px;
}
}
... ...
body.passport-body {
background-color: #444;
font-family: "MicroSoft YaHei",SimSun,sans-serif;
* {
box-sizing: border-box;
}
}
.passport-page {
text-align: center;
padding: 0 6%;
.header {
position: relative;
height: 80px;
margin: 40px 0 60px;
.go-back {
display: block;
position: absolute;
height: 60px;
width: 60px;
top: 10px;
left: 0;
background: resolve('passport/go-back.png') no-repeat;
background-size: 100% 100%;
}
.title {
font-size: 40px;
line-height: 80px;
color: #fff;
}
.img-header {
width: 136px;
height: 80px;
background: resolve('passport/yoho-family.png') no-repeat;
background-size: 100% 100%;
margin: 0 auto;
}
}
.input-container, .select-container {
position: relative;
width: 100%;
height: 104px;
font-size: 40px;
background-color: #575757;
border: 1px solid #606060;
border-radius: 10px;
text-align: left;
color: #fff;
}
.select-container {
.select {
position: absolute;
height: 100px;
padding-right: 80px;
right: 0;
color: #fff;
background-color: transparent;
border: 0;
border-radius: 10px;
appearance: none;
direction: rtl;
&:focus {
outline: 0;
border: none;
}
&:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #fff;
}
}
.select-title {
line-height: 2.5;
margin-left: 30px;
}
.arrow-right {
position: absolute;
width: 26px;
height: 40px;
right: 30px;
top: 32px;
background: resolve('passport/arrow-right.png') no-repeat;
background-size: 100% 100%;
}
}
.has-eye, .has-clear {
padding-right: 60px;
}
.area-code {
position: absolute;
left: 30px;
line-height: 2.5;
}
.phone-container {
padding-left: 110px;
}
.input {
width: 100%;
line-height: 52px;
padding: 24px 0;
padding-left: 30px;
border-radius: 10px;
color: #fff;
background-color: transparent;
border: none;
}
.btn {
display: block;
width: 100%;
font-size: 40px;
line-height: 2.5;
background-color: #36a74c;
border-radius: 10px;
color: #fff;
&.disable {
background-color: #a2a2a2;
}
}
.country-select.in-android-uc {
width: 180px;
}
.clear-input {
position: absolute;
display: none;
top: 36px;
right: 20px;
width: 32px;
height: 32px;
background: resolve('passport/clear-input.png') no-repeat;
background-size: 100% 100%;
}
.eye {
position: absolute;
top: 40px;
right: 20px;
width: 38px;
height: 24px;
background: resolve('passport/eye.png') no-repeat;
background-size: 100% 100%;
&.close {
background-image: resolve('passport/eye-close.png');
}
}
.row {
margin-bottom: 10px;
}
}
... ...
@import "common";
@import "register";
@import "login";
@import "back";
@import "code";
@import "bind";
... ...
.login-page {
.yoho-logo {
position: absolute;
height: 62px;
width: 52px;
background: resolve('passport/yoho.png');
background-size: 100% 100%;
top: 20px;
left: 30px;
}
.acc-container {
padding-left: 90px;
}
.op-container {
position: relative;
width: 100%;
margin: 40px 0;
text-align: left;
font-size: 32px;
.go-register {
text-decoration: underline;
color: #858585;
}
.forget-pwd {
position: absolute;
right: 0;
text-decoration: underline;
color: #858585;
}
}
.third-party-login {
text-align: left;
> span {
font-size: 32px;
color: #858585;
}
.tp-link {
text-align: center;
padding: 40px 0;
> a {
display: inline-block;
width: 88px;
height: 88px;
margin: 0 14px;
@include border-radius(50%);
background-color: #333;
background-repeat: no-repeat;
background-size: 100% 100%;
}
.alipay {
background-image: resolve('passport/alipay.png');
}
.weibo {
background-image: resolve('passport/weibo.png');
}
.weixin {
background-image: resolve('passport/weixin.png');
}
.qq {
background-image: resolve('passport/qq.png');
}
}
}
.international {
display: block;
width: 400px;
padding: 10px 20px;
background-color: #333;
border: none;
border-radius: 40px;
margin: 0 auto;
font-size: 32px;
color: #d8d8d8;
}
.login-tip {
font-size: 16px;
position: relative;
color: #d8d8d8;
margin: 30px 0;
.info-icon {
display: inline-block;
height: 24px;
width: 24px;
background-image: resolve('passport/info.png');
background-size: 100% 100%;
}
}
.mask {
position: fixed;
display: none;
top: 0;
bottom: 0;
right: 0;
left: 0;
background-color: rgba(0,0,0,.5);
}
.retrive-pwd-ways {
position: fixed;
display: none;
bottom: 10px;
left: 20px;
right: 20px;
font-size: 32px;
li {
background-color: #fff;
width: 100%;
height: 80px;
line-height: 80px;
text-align: center;
&:nth-child(1) {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom: 1px solid #9f9f9f;
}
&:nth-child(2) {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
&:last-child {
margin-top: 10px;
border-radius: 10px;
}
}
}
}
... ...
.reg-page .register-tip {
color: #fff;
font-size: 30px;
}
... ...