金诚优选前端代码
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.
 
 
 
 
 

528 lines
11 KiB

@import '../../../common/css/global';
#personalCenter{
.pc-banner{
//height:150px;
background: #FB5054;
&.uto-banner {
background: none;
.bg {
background-image: url("https://ibrand-miniprogram.oss-cn-hangzhou.aliyuncs.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E8%83%8C%E6%99%AF_%E7%94%BB%E6%9D%BF%201535353.png");
}
}
.bg {
display: flex;
justify-content: space-between;
align-items: center;
background-image: url("https://ibrand-miniprogram.oss-cn-hangzhou.aliyuncs.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/22%20copy.png");
background-repeat: no-repeat;
background-size: cover;
height: 170px;
padding-left: 22px;
//padding:0 0 35px 17px;
.ban-item-l{
display: flex;
align-items: center;
.user-avatar{
width: 78px;
height: 78px;
border-radius: 50%;
margin-right: 15px;
background: #EDF2FC;
image{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.user-text{
font-size: 0px;
.nick-name{
font-size: 16px;
color: #ffffff;
padding-bottom: 8px;
}
.vip-text{
display: flex;
align-items: center;
.vip-grade{
color:#FB5054;
width: 16px;
height: 16px;
text-align: center;
line-height: 16px;
border-radius: 50%;
background-color: #ffffff;
font-size: 10px;
font-weight: bold;
}
.vip-name{
color:#008CEE;
font-size: 10px;
width: 32px;
height: 17px;
line-height: 17px;
text-align: center;
background-color: #ffffff;
border-radius: 8px;
margin-left: 6px;
&.svip{
color: #E1CB9C;
background: #424040;
}
}
}
}
}
.ban-item-r{
text-align: right;
.private-letter{
opacity: 0;
position: relative;
padding:16px 16px 26px 0;
display: inline-block;
.iconfont{
color: #ffffff;
font-size:22px;
}
.dot{
position:absolute;
top: 20px;
right: 16px;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #ffffff;
}
}
.up-grade{
display: flex;
align-items: center;
background-color:#424040;
border-radius: 100px 0px 0px 100px;
color:#E1CB9C;
padding:6px 6px 6px 6px;
.icon-img{
width:27px;
height: 27px;
background-color:rgba(255,255,255,.15);
padding: 5px;
border-radius: 50%;
image{
width: 100%;
height: 100%;
}
}
.vip-copy{
font-size: 12px;
padding-left: 6px;
.pretty{
font-size: 14px;
font-weight: bold;
text-align: left;
}
.up{
font-size: 10px;
line-height: 14px;
}
}
}
}
.unlogin{
margin: 0 auto;
text-align: center;
height:125px;
line-height: 125px;
color: #ffffff;
font-size: 24px;
}
.setting {
position: absolute;
top: 15px;
right: 15px;
color: #FFFFFF;
font-size: 20px;
}
}
}
//绑定手机号
.binding__phone{
padding: 10px 15px;
background: #FBF6DC;
color: #FC6A00;
font-size: 14px;
margin-bottom: 5px;
display:flex;
justify-content: space-between;
align-items: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
.phone-text{
flex: 1;
margin-left: 5px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
&.binding__user{
text-align: left;
border-radius: 0;
line-height: normal;
&:after {
border: none;
}
}
}
//新的优惠券盒子样式
.new-coupons-box{
margin: 0 15px;
background-color: #251F2A;
position: relative;
top:-30px;
margin-bottom: -13px;
box-shadow:0px 3px 6px 1px rgba(0,0,0,0.15);
.top-item{
display: flex;
align-items: center;
justify-content:center;
padding:16px 0 0 0;
.info{
flex: 1;
text-align: center;
overflow: hidden;
.balance{
color: #fff;
font-size: 14px;
font-weight: 500;
padding-bottom: 5px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
.txt{
color: #ffffff;
font-size: 14px;
line-height: 20px;
}
}
}
.bottom-item{
padding: 18px 0;
.bg-img{
margin: 0 auto;
width: 70%;
display: flex;
align-items: center;
background: url("https://ibrand-miniprogram.oss-cn-hangzhou.aliyuncs.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E4%BC%98%E6%83%A0%E5%88%B8665656.png") no-repeat;
background-size: 100% 100%;
.title{
flex: 5;
text-align: center;
color: #ffffff;
font-size:26px;
line-height: 37px;
margin: 9px 0 13px 0;
}
.number{
color:#ffffff;
flex:2;
text-align: center;
font-size:26px;
line-height: 37px;
margin: 9px 0 13px 0;
}
}
}
}
.all-orders{
background-color: #ffffff;
margin-bottom: 12px;
.order-header{
display: flex;
align-items: center;
justify-content:space-between ;
padding: 11px 15px 9px 15px;
.order-text{
font-size: 14px;
color: #000000;
line-height: 20px;
font-weight: bold;
}
.iconfont{
font-size: 12px;
color: #B3B3B3;
}
}
.order-content{
display: flex;
align-items: center;
justify-content: center;
padding: 20px 0 10px 0;
.item{
flex: 1;
text-align: center;
font-size:12px;
color:#6A6A6A ;
position: relative;
.iconfont{
font-size: 20px;
color:#6A6A6A;
}
.position-num{
position: absolute;
top: 0;
right: 8px;
width:16px;
height: 16px;
line-height: 16px;
text-align: center;
background-color: #ffffff;
border: 1px solid @mainColor;
color: @mainColor;
font-size:10px;
border-radius: 50%;
overflow: hidden;
white-space: nowrap;
//text-overflow: ellipsis;
}
}
}
}
.info-detail{
display: flex;
padding: 15px 0px;
align-items: center;
justify-content: center;
background-color: #ffffff;
margin-bottom: 12px;
.item{
flex: 1;
text-align: center;
font-size:12px;
color:#6A6A6A ;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
.number{
font-size: 16px;
color: #333;
line-height: 15px;
padding-bottom:7px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
.section-serve{
background-color: #ffffff;
margin-bottom: 12px;
.title{
padding: 11px 15px 9px 15px;
font-size: 14px;
color: #000000;
line-height: 20px;
font-weight: bold;
}
.server-box{
display: flex;
width: 100%;
align-items: center;
flex-wrap: wrap;
.item{
width:25%;
text-align: center;
padding:19px 0;
font-size: 12px;
color:#6A6A6A;
.iconfont{
font-size: 20px;
color: #ffffff;
}
.info{
display: inline-block;
width: 44px;
height: 44px;
line-height: 44px;
text-align: center;
background-color: #F25E62;
margin-bottom: 12px;
border-radius: 50%;
}
.mall{
background-color:#F8AB2C ;
}
.mi{
background-color:#5787ED;
}
.agree{
background-color:#6236FF;
}
.custom{
background-color: #37CEAC;
}
.center{
background-color:#5787ED ;
}
.team{
background-color:#D06D3C;
}
}
}
}
.section-activity{
background-color: #ffffff;
margin-bottom: 30px;
.title{
padding: 11px 15px 9px 15px;
font-size: 14px;
color: #000000;
line-height: 20px;
font-weight: bold;
}
.activity-box{
display: flex;
align-items: center;
justify-content: center;
padding: 18px 0 15px 0;
.item{
flex: 1;
color:#6A6A6A ;
font-size: 12px;
text-align: center;
.iconfont{
color:#008CEE ;
font-size: 17px;
padding-bottom:10px;
}
}
}
}
.maks{
position: fixed;
bottom: 0;
width: 100%;
height: 100%;
z-index: 40;
background: rgba(0,0,0,.4);
opacity: 1;
transition: opacity .3s ease;
display: none;
&.share {
background: none;
}
&.cur{
display: block;
}
}
.attention-WeChat{
position:fixed;
bottom:0;
width:100%;
height:0;
z-index:50;
//transition:all .3s linear;
color: #ffffff;
text-align: center;
overflow: hidden;
&.cur {
height: 40%;
}
.service-box {
display: flex;
align-content: center;
background: #ffffff;
height: 100%;
font-size: 12px;
.item {
flex: 1;
display: flex;
flex-direction: column;
color: #000;
align-items: center;
justify-content: space-around;
image {
width: 72%;
}
&.phone {
background: #4B8AF2;
color: #ffffff;
&:before {
content: '';
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
background: #ffffff;
width: 20px;
height: 20px;
border-radius: 100%;
}
.phone-text {
width: 100%;
position: relative;
image {
//width: 72%;
opacity: 0;
}
font-size: 12px;
.phone-warp {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
i{
color: #FFFFFF;
font-size: 50px;
}
.phone-num {
font-size: 20px;
}
}
}
}
}
.vmc-popup{
background: none;
}
}
.swiper-adv{
padding:10px 15px;
swiper{
height: 140px;
image{
width: 100%;
vertical-align: middle;
height: 100%;
}
}
}
}