/* pages/orderList/orderList.wxss */ page { background-color: #f4f4f4; color: #333; padding-bottom: 200rpx; } /* 头部菜单 */ .order-tit { position: fixed; top: 0; display: flex; justify-content: space-around; z-index: 999; width: 100%; height: 88rpx; line-height: 88rpx; background-color: #fff; } .order-tit text { display: block; font-size: 24rpx; text-align: center; } .order-tit text.on { border-bottom: 4rpx solid #FF941A; color: #FF941A; font-weight: 600; } /* end 头部菜单 */ .main { margin-top: 108rpx; } /* 商品列表 */ .prod-item { background-color: #fff; font-size: 28rpx; margin: 0 24rpx 20rpx; border-radius: 16rpx 16rpx 16rpx 16rpx; padding: 0 24rpx; } /* 店铺 */ .shop-box { padding: 20rpx 0; border-bottom: 2rpx solid #f2f2f2; display: flex; align-items: center; justify-content: space-between; } .shop-box .shop-info{ display: flex; align-items: center; } .delivery-info{ background: #F9F9F9; border-radius: 16rpx 16rpx 16rpx 16rpx; margin-top: 20rpx; padding: 24rpx; margin-bottom: 20rpx; } .delivery-info .title-box{ display: flex; font-weight: bold; font-size: 28rpx; color: #222222; } .delivery-info .title-box .icon{ width: 36rpx; height: 36rpx; margin-right: 20rpx; } .delivery-info .desc{ font-size: 24rpx; color: #AAAAAA; margin-top: 14rpx; } .delivery-info .time{ font-size: 24rpx; color: #AAAAAA; margin-top: 14rpx; } .shop-icon { width: 36rpx; height: 36rpx; margin-right: 10rpx; font-size: 0; } .shop-icon > image { width: 100%; height: 100%; } .shop-name { font-size: 32rpx; font-weight: 600; position: relative; padding-right: 20rpx; } /* .shop-name::after { position: absolute; right: 0; top: 16rpx; display: block; width: 10rpx; height: 10rpx; content: " "; font-size: 0; border-top: 4rpx solid #444; border-right: 4rpx solid #444; border-radius: 4rpx; transform: rotate(45deg); } */ .prod-item .order-num { padding: 20rpx 0; font-size: 24rpx; display: flex; align-items: center; } .order-num > text { flex: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .order-state { color: #999999; display: flex; align-items: center; font-size: 24rpx; } .order-state .red { color: #e43130; } .prod-item .order-state .clear-btn { width: 28rpx; height: 28rpx; font-size: 0; margin-left: 42rpx; position: relative; } .prod-item .order-state .clear-btn::after { content: " "; display: block; position: absolute; left: -20rpx; top: 0rpx; width: 2rpx; height: 32rpx; background: #eee; } .prod-item .order-state .clear-btn .clear-list-btn { width: 100%; height: 100%; } .prod-item .item-cont { display: flex; align-items: center; padding: 20rpx; display: -webkit-flex; display: -webkit-box; display: -moz-box; display: -ms-flexbox; background: #f7f7f7; position: relative; border-radius: 16rpx 16rpx 16rpx 16rpx; } .prod-item .item-cont .categories { white-space: nowrap; } .prod-item .item-cont .prod-pic { position: relative; display: inline-block; font-size: 0; width: 160rpx; height: 160rpx; background: #fff; margin-right: 20rpx; } .prod-item .item-cont .prod-pic image { width: 100%; height: 100%; } .spell-group-order { position: absolute; display: block; top: 0; left: 0; width: 60rpx; height: 30rpx; } .prod-item .item-cont .prod-info { font-size: 24rpx; position: relative; height: 160rpx; -webkit-flex: 1; -ms-flex: 1; -webkit-box-flex: 1; -moz-box-flex: 1; flex: 1; } .prod-item .item-cont .prod-info .prodname { font-size: 28rpx; color: #222; line-height: 34rpx; max-height: 68rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; } .prod-item .item-cont .prod-info .sku-box { display: flex; align-items: center; margin-top: 10rpx; } .prod-item .item-cont .prod-info .sku-box .prod-info-cont { color: #999; font-size: 24rpx; flex: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } /* 拼团icon */ .spell-group-icon { margin-right: 10rpx; font-size: 20rpx; color: #fff; background: #e43130; padding: 0 6rpx; border-radius: 4rpx; display: flex; align-items: center; } /* 拼团icon */ .prod-item .price-nums { position: absolute; bottom: 0; width: 100%; display: flex; align-items: center; line-height: 32rpx; } .prod-item .price-nums .prodprice { flex: 1; } .prod-item .symbol, .prod-item .small-num { font-size: 32rpx; color: #FF4D3A; font-weight: bold; } .prod-item .big-num { font-size: 32rpx; color: #FF4D3A; font-weight: bold; } .prod-item .price-nums .prodcount { color: #999; font-family: verdana; } .prod-item .total-num { display: flex; justify-content: space-between; align-items: center; padding: 20rpx 0; font-size: 24rpx; } .prod-item .total-num .prodprice { color: #333; } .prod-item .total-num .prodcount { margin-right: 20rpx; color: #999; } .prod-item .prod-foot { padding: 20rpx 0; border-top: 2rpx solid #e6e6e6; } .prod-item .prod-foot .total { font-size: 24rpx; margin-bottom: 20rpx; padding-bottom: 20rpx; border-bottom: 2rpx solid #e9eaec; } .other-button-hover { background-color: blue; } .button-hover { background-color: #e43130; } /** 添加自定义button点击态样式类**/ .button-hover { background-color: blue; } .btn { display: flex; justify-content: flex-end; align-items: center; } .button { display: inline-block; margin-left: 10px; font-size: 24rpx; background: #fff; padding: 10rpx 30rpx; border-radius: 80rpx; border: 2rpx solid #bbb; } .button.warn { color: #FF941A; border-color: #FF941A; } /* end 商品列表 */ /* 根据状态显示不同的颜色 */ .order-state .order-sts.red { color: #e43130; } .order-state .order-sts { color: #777777; } /* 列表为空 */ .empty { padding-top: 200rpx; text-align: cneter; } .empty-icon { display: block; width: 80rpx; height: 80rpx; margin: 0 auto; margin-bottom: 20rpx; } .empty-icon > image { display: block; width: 100%; height: 100%; } .empty-text { font-size: 28rpx; text-align: center; color: #999; line-height: 2em; }