card.wxss 1.97 KB
/* components/2.0/seller/card.wxss */
@import "../../../colorui/main.wxss";
.seller{
    height: 304rpx;
    background: #FFFFFF;
    box-shadow: 0px 0px 30rpx 0px #E5E5E5;
    border-radius: 20rpx;
    position: relative;
    border: 2rpx solid #FFFFFF;
}
.seller.active{
    border: 2rpx solid #FFC9AA;
}
.avatar{
    position: relative;
}
.avatar-image{
    width: 200rpx;
    height: 188rpx;
    background: #D8D8D8;
    border-radius: 10rpx;
}
.avatar-txt{
    background: linear-gradient(180deg, #FFC140 0%, #FFA000 100%);
    width: 96rpx;
    height: 37rpx;
    border-radius: 10rpx 4rpx 20rpx 0px;
    position: absolute;
    top:0;
    left:0;
    line-height: 37rpx;
}
.title{
    font-size: 38rpx;
    font-weight: 600;
    height: 52rpx;
    line-height: 52rpx;
}
.active .cu-tag{
    height: 36rpx;
    line-height: 36rpx;
    border-radius: 4rpx;
    padding: 0 10rpx;
}
.reserve-view .cu-tag{
    height: 52rpx;
    border-color: #5EB2FF;
    padding: 0 20rpx;
    line-height: 52rpx;
}
.reserve-view .cu-tag {
    margin-right: 20rpx;
    margin-left: 0;
}
.cu-tag-end{

}
.button-view{
    width: 144rpx;
    height: 56rpx;
    position: relative;
}
.button-shadow{
    width: 82rpx;
    height: 60rpx;
    background: #FFFFFF;
    box-shadow: 0px 0px 20rpx 0px #CCCCCC;
    position: absolute;
    right:82rpx;
    bottom:16rpx;
}

.button-view:before{
    position: absolute;
    left:0;
    top:0rpx;
    height: 60rpx;
    width: 20rpx;
    background: #FFFFFF;
    box-shadow: 0px 0px 20rpx 0px #CCCCCC;
    content: "";
    display: block;
}
.button-view:after{
    position: absolute;
    left:0;
    top:-20rpx;
    width: 50rpx;
    height: 90rpx;
    background-color: #ffffff;
    content: "";
    display: block;
}
.seller.active .button-view:after{
    top:-26rpx;
}
.reserve-button{
    width: 124rpx;
    height: 56rpx;
    background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
    border-radius: 28rpx;
    z-index: 1;
}
.avatar-block{
    height: 188rpx;
    overflow: hidden;
}