detail.ttss 1.7 KB

123456789101112131415161718192021
  1. page{background-color: #f8f8f8;}
  2. .dialog-msg .mark{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 90;background-color: rgba(0, 0,0, 0.3);}
  3. .dialog-msg .msg-body{position: fixed;background-color: #fff;z-index: 99;left: 5%;right: 5%;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);border-radius: 10rpx;padding: 40rpx;}
  4. .dialog-msg .msg-body .title{text-align: center;line-height: 48rpx;color: #333;font-weight: bold;margin-bottom: 20rpx;position: relative;padding: 20rpx 0;}
  5. .dialog-msg .msg-body .title image{width: 60rpx;height: 60rpx;position: absolute;top: 0;right: 0;}
  6. .dialog-msg .msg-body .desc{line-height: 48rpx;color: #666;font-weight: bold;font-size: 26rpx;}
  7. .coupon-item{background-color: #fff;border-radius: 10rpx;width: calc(100% - 40rpx);margin: 20rpx auto;border: 2rpx solid #fff;border-radius: 10rpx;position: relative;}
  8. .coupon-item .state-img{position: absolute;right: 0;top: 0;}
  9. .coupon-item .state-img image{width: 100rpx;height: 100rpx;}
  10. .coupon-item .header{padding: 20rpx;font-size: 28rpx;color: #333;line-height: 48rpx;border-bottom: 2rpx solid #f8f8f8;}
  11. .coupon-item .footer{padding: 20rpx;border-top: 2rpx solid #f8f8f8;display: flex;justify-content: space-between;}
  12. .coupon-item .footer .state{flex: 1;}
  13. .coupon-item .footer .btn{width: 50%;font-size: 28rpx;}
  14. .coupon-item .body{display: flex;align-items: center;margin: 20rpx 0;}
  15. .coupon-item .img image{width: 160rpx;height: 160rpx;}
  16. .coupon-item .info{margin-left: 20rpx;}
  17. .coupon-item .name{font-size: 32rpx;color: #333;line-height: 46rpx;}
  18. .coupon-item .desc{color: #666;font-size: 28rpx;line-height: 48rpx;}
  19. .tips{text-align: center;line-height: 80rpx;color: #666;font-size: 28rpx;}