.head { width: 750rpx; background: #FFF9F2; font-size: 24rpx; line-height: 40rpx; color: #FA8C16; box-sizing: border-box; padding: 12rpx 30rpx; } .remarks { display: flex; justify-content: space-between; width: 750rpx; background-color: #FFFFFF; padding: 26rpx 0; view { font-size: 28rpx; font-family: PingFang SC-Regular, PingFang SC; color: #666666; margin-left: 30rpx; } textarea { margin-right: 30rpx; } } .tips { width: 750rpx; height: 56rpx; line-height: 56rpx; text-align: center; font-size: 24rpx; font-family: PingFang SC-Regular, PingFang SC; color: #999999; } .versions { display: flex; align-items: center; justify-content: space-between; width: 750rpx; height: 90rpx; background: #FFFFFF; font-size: 30rpx; font-family: PingFang SC-Bold, PingFang SC; font-weight: bold; color: #333333; padding: 0 30rpx; box-sizing: border-box; >view { font-size: 26rpx; color: #3874F6; padding: 0 20rpx; } } .user-item { display: flex; width: 100vw; box-sizing: border-box; background-color: #fff; padding: 20rpx 30rpx; align-items: center; .content { position: relative; width: 100%; .label { font-size: 30rpx; font-family: PingFang SC-Bold, PingFang SC; font-weight: bold; color: #333333; margin-top: 0; .tag1 { font-weight: normal !important; margin-right: 10rpx; } } view { font-size: 24rpx; font-family: PingFang SC-Regular, PingFang SC; color: #666666; margin-top: 8rpx; } .tag { display: flex; align-items: center; justify-content: center; width: 100rpx; height: 45rpx; font-size: 30rpx; border: 1px solid red; position: absolute; color: red; right: 0; top: 50%; margin-top: -22.5rpx; border-radius: 4rpx; } } } scroll-view { min-width: 100vw; background-color: #fff; .discounts { display: flex; align-items: center; height: 150rpx; box-sizing: border-box; .card { display: flex; align-items: center; width: 410rpx; height: 130rpx; padding: 10rpx 0; border-radius: 16rpx; mask-composite: subtract; -webkit-mask-image: radial-gradient(circle at 130rpx 4px, transparent 4px, red 4.5px), radial-gradient(closest-side circle at 50%, red 99%, transparent 100%); -webkit-mask-size: 100%, 2rpx 4rpx; -webkit-mask-repeat: repeat, repeat-y; -webkit-mask-position: 0 -4rpx, 130rpx; -webkit-mask-composite: source-out; box-sizing: border-box; margin-left: 15rpx; flex-shrink: 0; .card-left { width: 130rpx; text-align: center; font-size: 24rpx; font-weight: bold; color: #fff; } .card-right { padding: 16px 12px; display: flex; flex: 1; flex-direction: column; .card-info { margin: 0 0 10px 0; font-size: 14px; line-height: 20px; color: #fff; } .card-time { font-size: 12px; line-height: 16px; font-weight: normal; color: #fff; margin-top: 4px; } } } } } .footer { display: flex; justify-content: space-between; padding: 0 30rpx; position: fixed; width: 100vw; height: 130rpx; background: #FFFFFF; box-shadow: 0px -4rpx 16rpx 2rpx rgba(150, 157, 165, 0.16); bottom: 0; box-sizing: border-box; z-index: 9999; padding-top: 10rpx; .left { flex: 1; display: flex; justify-content: space-between; font-size: 24rpx; font-family: PingFang SC-Regular, PingFang SC; color: #333333; line-height: 86rpx; .price { font-size: 32rpx; font-family: PingFang SC-Medium, PingFang SC; font-weight: 500; color: #FF3B30; margin-right: 20rpx; } } .but-box { .but { min-width: 156rpx; height: 90rpx; background: var(--warning); border-radius: 8rpx; font-size: 28rpx; font-family: PingFang SC-Bold, PingFang SC; font-weight: bold; color: #FFFFFF; } } }