/* 解决插值表达式闪烁问题 */
|
[v-cloak] {
|
display: none;
|
}
|
|
/*
|
需要注意的是：
|
样式的reset中需先设置html字体的初始化大小为50px，这是为了防止js被禁用或者加载不到或者执行错误而做的兼容
|
样式的reset中需先设置body字体的初始化大小为16px，这是为了让body内的字体大小不继承父级html元素的50px，而用系统默认的16px
|
*/
|
|
* {
|
margin: 0;
|
padding: 0;
|
}
|
|
.g-doc {
|
width: 100%;
|
background: linear-gradient(-20deg, #FA8410, #FA8410);
|
}
|
|
.hander img {
|
width: 100%;
|
border-radius: 0.3rem;
|
background: linear-gradient(-20deg, #FA8410, #FA8410);
|
}
|
|
.user {
|
box-sizing: border-box;
|
width: 6.9rem;
|
background: #ffffff;
|
margin: auto;
|
border-radius: .3rem;
|
position: relative;
|
|
padding: .5rem .45rem .31rem .45rem;
|
}
|
|
.user-name img {
|
height: .86rem;
|
width: .86rem;
|
}
|
|
.user-name {
|
display: flex;
|
}
|
|
.remck {
|
color: #999999;
|
font-size: .24rem;
|
margin-top: .1rem;
|
}
|
|
.userimg {
|
margin-right: .2rem;
|
}
|
|
.code {
|
margin-left: .14rem;
|
font-size: .24rem;
|
color: #FF2A2A;
|
}
|
|
.iptList {
|
margin-top: .5rem;
|
}
|
|
input {
|
outline: none;
|
border: 0.01rem solid #cccccc;
|
background: #F6F6F6;
|
padding-left: 0.5rem
|
}
|
|
.tel {
|
width: 5.5rem;
|
height: .9rem;
|
border-radius: .45rem;
|
font-size: .3rem;
|
}
|
|
.verification {
|
margin-top: .39rem;
|
font-size: .3rem;
|
width: 3.18rem;
|
height: .9rem;
|
border-radius: .45rem;
|
}
|
|
.getcode {
|
width: 1.98rem;
|
height: .9rem;
|
background: linear-gradient(180deg, #FF838C, #FF2A2A);
|
border-radius: .45rem;
|
font-size: .26rem;
|
color: #FFFFFF;
|
line-height: .9rem;
|
margin-top: .39rem;
|
text-align: center;
|
margin-left: .2rem;
|
}
|
|
.chenck {
|
height: .3rem;
|
width: .3rem;
|
}
|
|
.agreeCen {
|
font-size: .2rem;
|
color: #999999;
|
display: flex;
|
justify-items: center;
|
height: .3rem;
|
margin-top: .3rem;
|
}
|
|
.agreeCen .agree {
|
margin-left: .14rem
|
}
|
|
.btn {
|
width: 6rem;
|
height: .9rem;
|
background: linear-gradient(180deg, #FF838C, #FF2A2A);
|
border-radius: .45rem;
|
text-align: center;
|
color: #fff;
|
font-size: .36rem;
|
line-height: .9rem;
|
margin-top: .35rem;
|
}
|
|
.btnList {
|
width: 6.9rem;
|
padding: .3rem 0;
|
background: #FFFFFF;
|
border-radius: .3rem;
|
margin: auto;
|
margin-top: 0.2rem;
|
display: flex;
|
justify-content: space-around;
|
margin-bottom: .2rem
|
}
|
|
.iconStyle {
|
width: 1.4rem;
|
font-size: .22rem;
|
color: #333333;
|
|
}
|
|
.iconStyleImg {
|
display: flex;
|
justify-content: center;
|
}
|
|
.btnList img {
|
height: 0.86rem;
|
margin: 0 auto;
|
width: 0.86rem;
|
color: #333333;
|
margin-bottom: .19rem;
|
}
|
|
.goodsList {
|
margin-top: .2rem;
|
width: 6.9rem;
|
height: auto;
|
background: #FFFFFF;
|
border-radius: .3rem;
|
margin: auto;
|
}
|
|
.henderTitle img {
|
width: 6.9rem;
|
border-radius: 1rem;
|
}
|
|
.telPhon {
|
font-size: .36rem
|
}
|
|
.goodsImg {
|
height: 2.16rem;
|
width: 2.16rem;
|
border-radius: .1rem;
|
}
|
|
.goodsTitle {
|
font-size: .26rem;
|
color: #333333;
|
margin-top: .2rem;
|
margin-bottom: .24rem;
|
width: 2.16rem;
|
text-align: center;
|
}
|
|
.goodsBtn {
|
width: 1.41rem;
|
background: linear-gradient(180deg, #FF838C, #FD4F5C);
|
border-radius: 0.26rem;
|
font-size: .24rem;
|
height: .52rem;
|
color: #FFFFFF;
|
text-align: center;
|
line-height: .52rem;
|
margin: auto;
|
}
|
|
.goods {
|
width: 2.16rem;
|
margin: 0.2rem 0.05rem 0.17rem 0.05rem
|
}
|
|
.goodsListCen {
|
width: 6.9rem;
|
padding: 0 .05rem;
|
padding-bottom: .17rem;
|
box-sizing: border-box;
|
margin-top: .2rem;
|
display: flex;
|
flex-wrap: wrap;
|
margin-top: -0.2rem;
|
}
|
|
.huaxiang {
|
color: #FF2A2A
|
}
|
|
.popup {
|
margin: 0 auto;
|
height: 6rem;
|
width: 6rem;
|
background: #FFFF;
|
border-radius: .3rem;
|
}
|
|
.shadow {
|
position: fixed;
|
top: 0;
|
height: 100vh;
|
width: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
background-color: rgba(0, 0, 255, 0.3)
|
}
|
|
.popupCongratulate {
|
text-align: center;
|
font-size: .40rem;
|
font-weight: bold;
|
margin-bottom: .3rem;
|
}
|
|
.popupSon {
|
margin: 0 auto;
|
font-size: .2rem;
|
width: 4rem;
|
text-align: center;
|
}
|
|
.btnApp {
|
width: 3rem;
|
background: linear-gradient(180deg, #FF838C, #FF2A2A);
|
border-radius: .45rem;
|
text-align: center;
|
color: #fff;
|
font-size: .3rem;
|
line-height: .9rem;
|
margin: .5rem auto;
|
}
|
|
.logo {
|
width: 100%;
|
margin-top: .5rem;
|
margin-bottom: .2rem
|
}
|
|
.logo img {
|
border-radius: 50%;
|
height: 2rem;
|
width: 2rem;
|
margin: 0 auto;
|
display: block;
|
}
|
|
.footer {
|
width: 100%;
|
padding: .5rem 0;
|
color: #fff;
|
}
|
|
.footer div {
|
text-align: center;
|
}
|
