page { background-color: #f7f7f7; } .page { padding: 40rpx; .status-line { display: flex; align-items: center; justify-content: center; font-size: 40rpx; color: #e04775; font-weight: bold; .icon { margin-right: 16rpx; width: 48rpx; height: 50rpx; } } .site { margin-top: 26rpx; padding: 32rpx; background: #ffffff; border-radius: 24rpx; display: flex; align-items: center; .icon { margin-right: 16rpx; flex-shrink: 0; width: 44rpx; height: 44rpx; } .wrap { .title { font-size: 32rpx; font-weight: bold; color: #3f3f3f; } .content { margin-top: 12rpx; font-size: 28rpx; color: #bebfc1; } } } .shop { margin-top: 16rpx; padding: 32rpx; background: #ffffff; border-radius: 24rpx; display: flex; align-items: center; .shop-img { flex-shrink: 0; width: 204rpx; height: 204rpx; border-radius: 24rpx; } .wrap { flex: 1; padding-left: 24rpx; .name { font-size: 32rpx; font-weight: bold; color: #3f3f3f; line-height: 44rpx; min-width: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .specification { display: inline-block; margin-top: 8rpx; font-size: 28rpx; color: #b6b7ba; border-radius: 10rpx; } .price { margin-top: 14rpx; display: flex; align-items: center; justify-content: space-between; .num { font-size: 32rpx; color: #e04775; font-weight: bold; .sub { font-size: 22rpx; } } .val { font-size: 28rpx; color: #b6b7ba; } } } } .detail { margin-top: 16rpx; padding: 8rpx 32rpx; background: #ffffff; border-radius: 24rpx; .row { padding: 24rpx 0; display: flex; align-items: center; justify-content: space-between; .label { font-size: 28rpx; color: #bbbcbe; } .content { padding-left: 46rpx; flex: 1; font-size: 28rpx; color: #3f3f3f; font-weight: bold; &.yellow { color: #f5ad1d; } } } .row:not(:first-of-type) { border-top: 1rpx solid #ebebeb; } } }