/* pages/basket/basket.wxss */ page { height: 100%; background: #f4f4f4; } .container { padding-bottom: 120rpx; height: auto; } .prod-list { /* margin-bottom: 120rpx; */ } .shop-item { margin-top: 20rpx; background: #fff; margin: 20rpx 24rpx 0; } /* 店铺 */ .choose-btn { display: inline-block; } .shop-item .head-shop { padding: 20rpx; background: #fff; display: flex; align-items: center; } .shop-item .head-shop image { width: 100%; height: 100%; display: block; } .shop-item .head-shop .shop-box { flex: 1; display: flex; align-items: center; margin-left: 8rpx; } .shop-item .head-shop .shop-icon { width: 32rpx; height: 32rpx; margin-right: 10rpx; } .shop-item .head-shop .shop-name { font-size: 28rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .shop-item .prod-block .discount-tips { border-top: 2rpx solid #eee; padding: 20rpx 16rpx; height: 40rpx; line-height: 40rpx; } .shop-item .prod-block .discount-tips .text-block { padding: 4rpx 6rpx; border-radius: 4rpx; font-size: 20rpx; background: #e43130; color: #fff; position: relative; } .shop-item .prod-block .discount-tips .text-block::before{ position: absolute; left: 14rpx; bottom: -16rpx; content: ""; display: block; width: 0; height: 0; border: 8rpx solid transparent; border-top: 8rpx solid #e43130; } .shop-item .prod-block .discount-tips .text-list { font-size: 24rpx; margin-left: 10rpx; font-weight: 600; } .shop-item .prod-block .discount-tips .text-list.reduce-amount { font-weight: normal; color: #e43130; padding-left: 20rpx; } .shop-item .prod-block .goods-item { position: relative; } .shop-item .prod-block.discount .goods-item::after{ position: absolute; left: 36rpx; top: 0; bottom: 0; width: 2rpx; height: auto; content: ""; border-left: 2rpx dashed #eee; z-index: 0; } .shop-item .prod-block .item { background: #fff; display: flex; align-items: center; padding: 20rpx; border-top: 2rpx solid #f2f2f2; z-index: 2; } .shop-item .prod-block .item .btn { z-index: 3; } .shop-item .prod-block .item .prodinfo { position: relative; color: #999; flex: 1; display: flex; margin-left: 10rpx; } .shop-item .prod-block .item .prodinfo .pic { text-align: center; width: 200rpx; height: 200rpx; width: 160rpx; height: 160rpx; line-height: 180rpx; font-size: 0; } .shop-item .prod-block .item .prodinfo .pic image { width: 100%; height: 100%; border-radius: 16rpx; } .shop-item .prod-block .item .prodinfo .opt { margin-left: 20rpx; flex: 1; } .shop-item .prod-block .item .prodinfo .opt .prod-name { font-size: 28rpx; color: #333; max-height: 72rpx; line-height: 36rpx; display: -webkit-box; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row { display: flex; align-items: center; margin-top: 10rpx; height: 36rpx; line-height: 36rpx; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row .prod-discount { padding: 0 16rpx; background: #fdf1f2; margin-right: 20rpx; display: flex; align-items: center; border-radius: 20rpx; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row .prod-discount .discount-name { color: #e43130; font-size: 22rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row .prod-discount .down-arrow { width: 10rpx; height: 10rpx; border-bottom: 2rpx solid #e43130; border-right: 2rpx solid #e43130; transform: rotate(45deg); margin-left: 10rpx; margin-bottom: 6rpx; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row .prod-info-text { color: #666; background: #f3f3f3; padding: 0 16rpx; border-radius: 20rpx; font-size: 22rpx; position: relative; font-family: arial; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .shop-item .prod-block .item .prodinfo .opt .prod-center-row .prod-info-text.empty-n { display: none; } .shop-item .prod-block .item .prodinfo .opt .price-count { display: flex; align-items: center; justify-content: space-between; height: 56rpx; margin-top: 20rpx; } /* 加减框 */ .shop-item .prod-block .item .prodinfo .opt .m-numSelector { display: flex; box-sizing: border-box; border: 2rpx solid #eee; border-radius: 4rpx; } .shop-item .prod-block .item .prodinfo .opt .m-numSelector .minus, .shop-item .prod-block .item .prodinfo .opt .m-numSelector .plus { height: 56rpx; width: 56rpx; box-sizing: border-box; position: relative; } .shop-item .prod-block .item .prodinfo .opt .m-numSelector input { width: 56rpx; height: 56rpx; text-align: center; color: #333; border-left: 2rpx solid #eee; border-right: 2rpx solid #eee; font-size: 24rpx; font-family: arial; } .shop-item .prod-block .item .prodinfo .opt .m-numSelector .minus::before, .shop-item .prod-block .item .prodinfo .opt .m-numSelector .plus::before, .shop-item .prod-block .item .prodinfo .opt .m-numSelector .plus::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; content: ' '; width: 22rpx; height: 2rpx; background-color: #7f7f7f; } .shop-item .prod-block .item .prodinfo .opt .m-numSelector .plus::after { transform: rotate(90deg); } .shop-item .prod-block .item .prodinfo .opt .m-numSelector:not(.disabled) .minus:not(.disabled):active, .shop-item .prod-block .item .prodinfo .opt .m-numSelector:not(.disabled) .plus:not(.disabled):active { opacity: 0.6; } /*checkbox 选项框大小 */ checkbox .wx-checkbox-input { border-radius: 50%; width: 32rpx; height: 32rpx; } /*checkbox选中后样式 */ checkbox .wx-checkbox-input.wx-checkbox-input-checked { /* background: #e43130; border-color: #e43130; */ background: #04358D; border-color: #04358D; } /*checkbox选中后图标样式 */ checkbox .wx-checkbox-input.wx-checkbox-input-checked::before { text-align: center; font-size: 20rpx; color: #fff; background: transparent; transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); } /** 底部按钮 */ .cart-footer { position: fixed; bottom: 0; left: 0; width: 100%; display: flex; align-items: center; height: 90rpx; z-index: 999; background: #fff; box-shadow: -6rpx 0 6rpx rgba(0, 0, 0, 0.1); } .cart-footer .all { font-size: 28rpx; margin-left: 20rpx; } .cart-footer .all label { display: flex; align-items: center; } .cart-footer .del { color: #e43130; font-size: 24rpx; margin-left: 20rpx; } .cart-footer .total { flex: 1; display: flex; align-items: center; margin-left: 40rpx; } .cart-footer .total .total-con .finally .blod { font-weight: bold; font-size: 28rpx; } .cart-footer .total .total-con .finally .price { font-size: 30rpx; } .cart-footer .total .total-msg { font-size: 22rpx; text-align: right; } .cart-footer .total .arrow-icon { width: 40rpx; height: 20rpx; margin-left: 10rpx; } .cart-footer .total .arrow-icon image { display: block; width: 100%; height: 100%; } .cart-footer .settle { height: 70rpx; line-height: 70rpx; /* padding: 0 50rpx; */ width: 220rpx; text-align: center; background: #04358D; color: #fff; border-radius: 70rpx; margin-right: 20rpx; font-size: 28rpx; } /** end 底部按钮 */ /* 满减活动弹框 */ /*模态框*/ .modals { position: fixed; z-index: 999; top: 0; left: 0; right: 0; bottom: 0; } .pri-modal { position: fixed; z-index: 99; top: 0; left: 0; right: 0; bottom: 0; } .modals-cancel { position: absolute; z-index: 1000; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); } .bottom-dialog-body { position: absolute; z-index: 10001; bottom: 0; left: 0; right: 0; height: 500rpx; background-color: #fff; } .bottom-dialog-box { position: absolute; z-index: 10001; bottom: 90rpx; left: 0; right: 0; height: 500rpx; background-color: #fff; } .radius { border-radius: 20rpx 20rpx 0 0; } /*动画前初始位置*/ .bottom-pos { -webkit-transform: translateY(100%); transform: translateY(100%); } .radio-group { display: block; width: 100%; height: 350rpx; overflow-y:auto; } .discount-title { font-size: 30rpx; margin-bottom: 20rpx; padding:26rpx; background: #f1f1f1; text-align: center; } radio { transform: scale(0.8); } radio .wx-radio-input{ text-align: left; } .discount-radio label{ display: inline-block; height:60rpx; line-height: 60rpx; } .discount-radio{ font-size: 28rpx; height:60rpx; line-height: 60rpx; padding:0 20rpx } /* 购物车为空 */ .empty { margin-top: 100rpx; text-align: cneter; } .empty-icon { display: block; width: 100rpx; height: 100rpx; margin: 0 auto; margin-bottom: 20rpx; } .empty-icon > image { width: 100%; height: 100%; } .empty-text { font-size: 28rpx; text-align: center; color: #999; line-height: 2em; } /* 金额明细 */ .price-detail { max-height: 220rpx; overflow-y: scroll; padding: 10rpx 20rpx; } .price-detail-item { display: flex; align-items: center; justify-content: space-between; height: 3em; font-size: 28rpx; border-bottom: 1px solid #f2f2f2; } .price-detail-item:last-child { border: 0; } .det-num { color: #e43130; }