test/pages/order/comment/index.wxss

/* pages/order/comment/index.wxss */
page{
  background-color: #FBF8FB;
  padding-bottom: 50rpx;
}
.product-box {
  padding: 0 30rpx 10rpx 30rpx;
  font-size: 28rpx;
  background-color: #fff;
}
.product-top {
  display: flex;
  padding: 40rpx 0;
  font-size: 26rpx;
  color: #666666;
}
.product-top image {
  width: 170rpx;
  height: 120rpx;
}
.product-info {
  flex: 1;
  width: 100%;
  margin: 0 30rpx;
  height: 120rpx;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

}
.product-title {
  font-size: 32rpx;
  color: #000;
}
.sku-name{
  margin-bottom:12rpx ;
}
.product-price {
  flex-shrink: 0;
  text-align: right;
}
.product-price .price {
  color: #D62828;
  font-size: 32rpx;
  font-weight: 500;
  margin-bottom: 30rpx;
}
.product-price .price text {
  font-size: 26rpx;
  font-weight: 400;
}
.product-num {
  color: #999999;
  font-size: 32rpx;
}
.icon-xingxing {
  font-size: 36rpx;
  color: #D62828;
  margin-right: 20rpx;
}
.icon-xingxing.disable {
  color: #999;
}
.tip {
  color: #000;
  margin-right: 40rpx;
  font-size: 32rpx;
}
.product-box textarea {
  display: block;
  width: 100%;
  height: 210rpx;
}
.btn {
  margin: 0 30rpx;
  margin-bottom: 79rpx;
  /* width: 360rpx; */
  line-height: 80rpx;
  text-align: center;
  color: #fff;
  background: #0B898E;
  font-size: 30rpx;
  font-weight: 500;
  border-radius: 40rpx;
  /* position: fixed;
  bottom: 40rpx;
  left: 50%;
  margin-left: -180rpx; */
}

/* 图片 */
.three{
  margin-top: 27rpx;
}
.weui-uploader{
  margin: 16rpx 0;
}
.tp_add{
  width: 152rpx;
  height: 152rpx;
  border-radius: 10rpx;
  opacity: 1;
  border: 2rpx dashed #999999;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: 22rpx;
  color: #BCBCBC;
}

.pics {
  float:left;
  position:relative;
  margin-right:15px;
  margin-bottom:15px;
  }
  .pics image{
    width: 152rpx;
    height: 152rpx;
  }
  .delete-btn{
    width: 20rpx;
    height: 20rpx;
    position: absolute;
    top: -15rpx;
    right: -5rpx;
  }
  .weui-uploader{
    padding: 10rpx 0;
  }
  .prd{
    border-bottom: 1px solid #CCCCCC;
  }
  .checkbox{
    margin: 16rpx 20rpx;
    color: #BCBCBC;
  }
  checkbox .wx-checkbox-input {
    width: 30rpx;
    height: 30rpx;
    border-radius: 50%;
  }

  checkbox .wx-checkbox-input.wx-checkbox-input-checked {
    border-color: #18d6ff;
    background-color: #18d6ff;
  }

  checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
    color:#fff;
  }
  .proad{
    margin: 20rpx;
  }
  .proad-title{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14rpx;
  }
  .proad-title image{
    width: 292rpx;
    height: 34rpx;
  }
  .pro-list{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
  }
  .proitem{
    width: 335rpx;
    background: #FFFFFF;
    border-radius: 13rpx;
    margin-top: 26.67rpx;
    box-shadow: 0rpx 2rpx 11rpx 0rpx rgba(201,201,201,0.3);
  }
  .item-hd {
    width: 335rpx;
    height: 278rpx;
  }
  .item-hd image{
    width: 100%;
      height: 100%;
      border-radius: 13rpx 13rpx 0px 0px;
  }
  .item-bm{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* height: 120rpx; */
    padding: 13rpx 14rpx;
    text-align: left;
  }
  .protitle{
    height: 80rpx;
    font-size: 28rpx;
    font-family: PingFang SC;
    font-weight: bold;
    color: #000000;
  }
  .pro-price{
    color: #D10000;
    font-weight: bold;
    font-size: 36rpx;
  }
  .pro-price:before {
    display: inline-block;
    content:"￥";
    color: #D62828;
    font-size: 20rpx;
  }
  
  .pro-price:after {
    display: inline-block;
    content:'起';
    color: #999999;
    font-size: 10px;
  }
  .proitem image:nth-child(1) {
    display: block;
    width: 100%;
    border-radius: 13rpx 13rpx 0 0;
  }
  .text-overflowRows {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    word-break: break-all;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }