test/pages/list/sale/index.wxss

/* pages/list/sale/index.wxss */
.sale-types {
  display: flex;
  justify-content: space-around;
  align-items: center;
  height: 86rpx;
  position: fixed;
  left: 0;
  right: 0;
  border-bottom: 1rpx solid #ccc;
  font-size: 29rpx;
  color: #333;
  background: white;
  z-index: 2;
}
.sale-type {
  position: relative;
  width: calc(100% / 3);
  text-align: center;
  height: 86rpx;
  line-height: 86rpx;
}
.sale-type.active {
  color: #000;
  font-size: 33rpx;
  font-weight: 500;
}
.sale-type.active::after {
  content: "1";
  font-size: 0;
  display: block;
  position: absolute;
  width: 46rpx;
  height: 5rpx;
  background: #0B898E;
  border-radius: 3rpx;
  left: 50%;
  margin-left: -23rpx;
  bottom: 0;
}
.list {
  margin: 32rpx;
  box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1);
  border-radius: 20rpx;
}
.sale-tip-box {
  padding: 31rpx 0;
  text-align: center;
  border-bottom: 1rpx solid #CCCCCC;
}
.sale-time {
  font-size: 33rpx;
  font-weight: 500;
  color: #333;
  margin-bottom: 20rpx;
}
.sale-time text {
  color: #D62828;
}
.sale-time-djs {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666666;
  font-size: 24rpx;
}
.sale-time-djs text {
  margin-right: 8rpx;
}
.time-box {
  width: 38rpx;
  height: 38rpx;
  text-align: center;
  line-height: 38rpx;
  border-radius: 7rpx;
  border: 1rpx solid #333;
  color: #D62828;
  margin-right: 8rpx;
}
.item {
  margin: 0 27rpx;
  padding: 30rpx 0;
  border-bottom: 1rpx solid #ccc;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.item .image-box {
  position: relative;
  width: 194rpx;
  height: 194rpx;
  flex-shrink: 0;
  margin-right: 25rpx;
  flex-shrink: 0;
}
.item .image-box image.border-img {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
}
.item image {
  width: 194rpx;
  height: 194rpx;
  display: block;
  flex-shrink: 0;
}
.right-info {
  flex: 1;
  width: 100%;
}
.right-info .title{
  font-size: 31rpx;
  line-height: 44rpx;
  color: #000;
  font-weight: 500;
  height: 88rpx;
  margin-bottom: 10rpx;
}
.sale-number {
  color: #999;
  margin-bottom: 7rpx;
  font-size: 23rpx;
}
.item-bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.item-bottom .btn {
  padding: 0 20rpx;
  /* width: 123rpx; */
  line-height: 52rpx;
  background: #D62828;
  border-radius: 26rpx;
  text-align: center;
  color: #fff;
  font-size: 27rpx;
  font-weight: 500;
}
.item-bottom .price {
  color: #D62828;
  font-size: 36rpx;
}
.item-bottom .price text:nth-child(1){
  font-size: 18rpx;
}
.item-bottom .price text:nth-child(2){
  font-weight: 500;
}
.item-bottom .price text:nth-child(3){
  color: #999;
  text-decoration: line-through;
  font-size: 24rpx;
}
.list .item:last-child,.list .sale-tip-box:last-child {
  border-bottom: none;
}