laundry/pages/my/share/share.wxss

/* pages/my/share/share.wxss */

.topBox {
    width: 750rpx;
    height: 328rpx;
    background: linear-gradient(360deg, #FE425D 0%, #FE7011 100%);
    overflow: hidden;
    border-radius: 0 0 25rpx 25rpx;
}


.topBox .user {
    width: 100rpx;
    height: 100rpx;
    box-shadow: 0px 4rpx 8rpx 0px #D43E28;
    border-radius: 50%;
    display: block;
    margin: 42rpx auto 30rpx;
}

.topBox .tips {
    font-size: 32rpx;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    text-align: center;
}

.contioner {
    width: 710rpx;
    height: 405rpx;
    background: #FFFFFF;
    box-shadow: 0px 10rpx 20rpx 0px rgba(232, 232, 232, 0.5);
    border-radius: 16rpx;
    margin: auto;
    position: relative;
    top: -100rpx;
    padding: 40rpx 24rpx;
}


.contioner .tit {
    width: 400rpx;
    height: 40rpx;
    display: block;
    margin: 0 auto 65rpx;
}

.contioner .yhj {
    position: relative;
    margin: auto;
    width: 662rpx;
    height: 200rpx;
    z-index: 1;
}

.contioner .msg {
    right: 0;
    top: 0;
    position: absolute;
    width: 85%;
    text-align: center;
    height: 100%;
}

.contioner .msg .price {
    font-size: 104rpx;
    font-weight: 500;
    color: #FFFFFF;
}

.contioner .msg .price .tips {
    font-size: 56rpx;
}


.contioner .msg .name {
    font-size: 30rpx;
    font-weight: 500;
    color: #FFFFFF;
}

.footerBtn {
    width: 622rpx;
    height: 90rpx;
    line-height: 90rpx;
    text-align: center;
    background: linear-gradient(90deg, #FE425D 0%, #FE7011 100%);
    border-radius: 45rpx;
    font-size: 32rpx;
    font-weight: 600;
    color: #FFFFFF;
    margin: auto;
}

.wrapper {
    width: 600rpx;
    min-height: 610rpx;
    position: fixed;
    padding-bottom: 40rpx;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.wrapper .content {
    padding-top: 220rpx;
}

.wrapper .content .inputbox {
    width: 540rpx;
    height: 92rpx;
    background: #FFFFFF;
    border-radius: 8rpx;
    margin: 0 auto 30rpx;
    padding: 20rpx;
}

.wrapper .content .inputbox input {
    font-size: 28rpx;
    color: #BDBDBD;
}

.wrapper .content .inputbox .button {
    font-size: 28rpx;
    color: #FF663D;
    border-left: 1px solid #E4E4E4;
    padding-left: 20rpx;
}

.wrapper .content .btn {
    width: 550rpx;
    margin: auto;
    line-height: 80rpx;
    height: 80rpx;
    background: linear-gradient(180deg, #FAD75F, #F76E1E);
    text-align: center;
    border-radius: 40rpx;
    color: #FFFFFF;
    font-size: 30rpx;
    margin-top: 40rpx;
}

.wrapper .close {
    width: 64rpx;
    height: 64rpx;
    position: absolute;
    left: 50%;
    bottom: -20%;
    transform: translate(-50%, 0);
}

.wrapper .state {
    width: 140rpx;
    height: 140rpx;
    margin: 30rpx auto;
    display: block;
}

.wrapper .tips {
    font-size: 30rpx;
    color: #FFFFFF;
    text-align: center;
}