.product-list{ height: 100vh; } .product-list .item{ background-color: #fff; margin:20rpx; padding:30rpx; border-radius: 18rpx; } .product-list .item .info{ display: flex; } .product-list .item .avatar{ width:180rpx;height:140rpx; border-radius: 10rpx; position: relative; } .product-list .item.off .avatar::before{ content: '已下架'; position: absolute; width:100%;height:100%; background-color: rgba(0, 0, 0, .5); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 500; } .product-list .item .right{ margin-left:20rpx; display: flex; flex-direction: column; justify-content: space-between; gap: 18rpx; min-height: 140rpx; } .product-list .item .name{ font-weight: 500; font-size: 32rpx; line-height: 40rpx; } .product-list .item .tags{ color:#555; font-size:26rpx; } .product-list .item .stat{ display: flex; justify-content: space-between; padding:40rpx 0 60rpx 0; } .product-list .item .s-item{ text-align: center; } .product-list .item .s-item .key{ margin-top:20rpx; font-size: 26rpx; color: #555; } .product-list .item .s-item .value{ font-size: 40rpx; font-weight: 600; } .actions{ display: flex; justify-content: flex-end; gap: 20rpx; } .actions .button{ background-color: #000; font-size: 28rpx; color:#fff; padding:18rpx 52rpx; line-height: 1; margin:0; } .actions .button.button-hover{ background-color: #000!important; color:#fff!important; }