// 配送信息 .flow-delivery { padding: 34rpx 30rpx; background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANYAAAANCAYAAADVGpDCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo3Yjk4M2ExYy1jMDhkLTQ1OTktYTI0Ny1kZjNjYzdiYTQ5ZTgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDQwNkY3RkU5N0NGMTFFNUI3N0M4NTU4MzM2RjlFODIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDQwNkY3RkQ5N0NGMTFFNUI3N0M4NTU4MzM2RjlFODIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowNzgwZWI1NS03OGFhLTQzOTUtODQ4OC1lOWI5YmVlYTY1ZDciIHN0UmVmOmRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDo1OTRiYzUyMy1jMzc3LTExNzgtYTdkZS04NGY3YmM1ZGIxMDMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz556PLxAAACBElEQVR42tyaSyhEYRTHP48imlKibDQeSSlkSlEWLCRFsZNH5FE2FqQ8ErIRC9lIkTwXSpMkWWChhEJCSnlkoUZGSsr78f98n43CMFPu/Z/6NZuZ2zn33/+cb869XkmLx8IDEQaGQJbgiytQDSY3MyL+LYnL/HxPXSoHDIJQQq2WQQk4Dbbb/yUB29LJ+6e3B66VB3ZITbUIEqSpCGoJBP1ghtBUD6ARpEtTGSEhXzd+awE9oJzQUPegWdf3QlBPMhgDMYRa7YNisGWkpP5qrBQtVBShUHugUE9hs4fUtwG0utlEjRivoA/Ug1sj3vjffr8FNJEK1auPFHcE9UTq5pdK2PwcoAzMG7mjuRrRYEIfK9jiDJSCBZJ6ynSTsBBqNQ0qgdPISbq6vJCFbJOaagrEk5gqWNczRGiqG1Ah1LLMafRkf5pYIUKtZnMJDXUNasAIST2ZYFioRx9ssQaKwJFZEv5uYmWDXVJTrYBEElP562PfPKGpnkAbSDOTqb6aWAGgW6iHol5kQj2CdtAJngnqkc1hHMQRNr9DPaXWzZj8Z2PZtFCxhEIdaKE2CGqRJ4060AH8CLUaALX6f5VpBZLhI9SaeZXQVHKNLt84SCIxVbhQi5YuQlNd6OVElZlN9TGxrGBUn2PZ4lyoTdIsST0FQj0UDSLUak6ot3gcBLVY3wQYAJoVXxmNERajAAAAAElFTkSuQmCC') bottom left repeat-x; background-size: 120rpx auto; margin-bottom: 25rpx; .detail-location { font-size: 36rpx; } .detail-content { padding: 0 20rpx; .detail-content__title-phone { margin-left: 10rpx; } .detail-content__describe { font-size: 28rpx; color: #777; } } .detail-content__title { margin-bottom: 6rpx; } } // 买家留言 .flow-all-money { .ipt-wrapper { .input { font-size: 28rpx; // width: 100%; display: block; height: 75rpx; } } } // 商品列表 .checkout_list { padding: 20rpx 30rpx 4rpx 30rpx; background: #fff; border-bottom: 1rpx solid rgb(248, 248, 248); .flow-shopList { padding: 5rpx 0 10rpx; border-bottom: 1rpx solid rgb(248, 248, 248); &:last-child { border-bottom: 0; } } } .flow-header-left { padding-left: 90rpx; } // 会员价 .flow-shopList { .flow-list-right { .flow-cont { &.price-delete { font-size: 26rpx; color: #777; text-decoration: line-through; } } } .grade-price { padding-top: 8rpx; font-size: 28rpx; color: $main-bg; text-align: right; } .goods-name { font-size: 27rpx; color: #333; // min-height: 68rpx; // line-height: 1.3; } } // 优惠券选择 .popup__coupon { background: #fff; box-sizing: border-box; padding: 30rpx 0 30rpx 0; // 设置ios刘海屏底部横线安全区域 padding-bottom: calc(constant(safe-area-inset-bottom) + 30rpx); padding-bottom: calc(env(safe-area-inset-bottom) + 30rpx); .coupon__do_not { position: relative; display: flex; justify-content: center; align-items: center; padding-top: 30rpx; box-shadow: 0 -12rpx 30rpx -6rpx rgba(151, 151, 151, 0.1); .control { display: flex; justify-content: center; align-items: center; width: 90%; height: 72rpx; color: #888; border: 1rpx solid #e3e3e3; border-radius: 10rpx; } } .coupon__title { text-align: center; margin-bottom: 15rpx; } .coupon-list { padding: 40rpx 30rpx; } .coupon-item { margin-bottom: 22rpx; font-size: 24rpx; background: #fff; border-radius: 12rpx; overflow: hidden; box-shadow: 0 8rpx 40rpx rgba(0, 0, 0, 0.06); position: relative; } .item-wrapper { display: flex; align-items: center; &.disable { .coupon-tag { background: linear-gradient(-113deg, #bdbdbd, #a2a1a2); } .coupon-reduce { color: #757575; } .state-text { color: #757575; } } } .coupon-tag { position: absolute; left: 0; top: 0; color: #fff; width: 96rpx; text-align: center; font-size: 22rpx; border-radius: 12rpx 0 12rpx 0; font-weight: 500; height: 34rpx; display: flex; align-items: center; justify-content: center; background: linear-gradient(to right, $main-bg, $main-bg2); color: $main-text; } .coupon-left { width: 242rpx; text-align: center; display: flex; flex-flow: column; justify-content: center; position: relative; .coupon-reduce { color: $main-bg; &-unit { display: inline-block; margin-right: -4rpx; font-size: 32rpx; font-weight: 600; } &-amount { display: inline-block; .value { font-size: 48rpx; } } } .coupon-hint { margin-top: 12rpx; color: #757575; font-size: 24rpx; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } .coupon-content { flex: 1; padding: 32rpx 0; position: relative; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; .coupon-name { color: #212121; font-size: 28rpx; font-weight: 500; } .coupon-middle { flex: 1; padding-top: 12rpx; margin-bottom: 26rpx; .coupon-expire { color: #757575; font-size: 24rpx; } } .coupon-expand { display: flex; align-items: center; color: #9e9e9e; font-size: 24rpx; &-arrow { margin-top: 4rpx; font-size: 24rpx; display: inline-block; vertical-align: initial; transform: rotate(0); margin-left: 8rpx; transition: all 0.15s ease-in-out; &.expand { transform: rotate(180deg); } } } } .coupon-right { padding-right: 38rpx; .btn-receive, .state-text { text-align: center; width: 100rpx; padding: 15rpx 0; } .btn-receive { font-size: 23rpx; line-height: 1; font-weight: 500; border-radius: 8rpx; cursor: pointer; background: linear-gradient(to right, $main-bg, $main-bg2); color: $main-text; } .state-text { } } .coupon-expand-rules { display: none; position: relative; &.expand { top: -30rpx; display: block; } &-content { padding: 8rpx 30rpx 8rpx 242rpx; font-weight: 400; color: #9e9e9e; line-height: 36rpx; .pre { font-family: auto; white-space: pre-wrap; word-wrap: break-word; word-break: break-all; } } } } // 积分抵扣 .points { .title { margin-right: 5rpx; } .icon-help { font-size: 28rpx; } .points-money { margin-right: 20rpx; } } // 商品规格 .goods-props { padding-top: 10rpx; font-size: 24rpx; color: #999; .goods-props-item { float: left; .group-name { margin-right: 6rpx; } } } // 右侧箭头 .right-arrow { margin-left: 16rpx; // color: #777; font-size: 26rpx; } // 底部操作栏 .flow-fixed-footer { position: fixed; bottom: var(--window-bottom); left: var(--window-left); right: var(--window-right); // width: 100%; background: #fff; border-top: 1px solid #eee; z-index: 11; // 设置ios刘海屏底部横线安全区域 padding-bottom: calc(constant(safe-area-inset-bottom) + var(--window-bottom)); padding-bottom: calc(env(safe-area-inset-bottom) + var(--window-bottom)); .chackout-left { font-size: 28rpx; line-height: 92rpx; color: #777; flex: 4; padding-left: 12px; } .chackout-right { font-size: 34rpx; flex: 2; } // 提交按钮 .flow-btn { background: linear-gradient(to right, $main-bg, $main-bg2); color: $main-text; text-align: center; line-height: 92rpx; display: block; font-size: 28rpx; // 禁用按钮 &.disabled { opacity: 0.6; } } } // 积分说明 .points-content { padding: 30rpx 48rpx; font-size: 28rpx; line-height: 50rpx; text-align: left; color: #606266; height: 520rpx; box-sizing: border-box; } // 共几件商品 .flow-num-box { font-size: 28rpx; color: #777; padding: 16rpx 24rpx; text-align: right; } // app.scss .flow-shopList { padding: 18rpx 0; .flow-list-left { margin-right: 20rpx; image { width: 180rpx; height: 180rpx; border: 1rpx solid #eee; background: #fff; } } .flow-list-right { .flow-cont { font-size: 28rpx; color: $main-bg; } .small { font-size: 26rpx; color: #777; } .flow-list-cont { padding-top: 10rpx; } } } .flow-all-money { padding: 0 24rpx; color: #444; .flow-all-list { font-size: 28rpx; padding: 20rpx 0; border-bottom: 1rpx solid rgb(248, 248, 248); } .flow-all-list:last-child { border-bottom: none; } .flow-all-list-cont { font-size: 28rpx; padding: 10rpx 0; } .flow-arrow { justify-content: flex-end; align-items: center; } } // 选项卡:配送方式 .swiper-tab { width: 100%; text-align: center; height: 85rpx; background-color: #fff; border-bottom: 1px solid rgb(248, 248, 248); display: flex; align-items: center; justify-content: space-around; .swiper-tab-item { width: 35%; height: 100%; font-size: 28rpx; color: #777; display: flex; justify-content: center; align-items: center; box-sizing: border-box; border-bottom: 2px solid #ffffff00; &.on { color: $main-bg; border-bottom: 2px solid $main-bg; } } } // 门店自提联系人 .flow-extract-contact { padding: 8rpx 24rpx; font-size: 28rpx; color: #444; margin-bottom: 25rpx; .contact-item { padding: 20rpx 0; border-bottom: 1rpx solid rgb(248, 248, 248); &:last-child { border-bottom: none; } } .item-label { margin-right: 26rpx; width: 150rpx; } .item-ipt .input { font-size: 28rpx; .input-placeholder { font-size: 28rpx; } } } // 自定义radio .my-radio { display: flex; align-items: center; justify-content: center; width: 34rpx; height: 34rpx; text-align: center; border: 1px solid #c8c9cc; transition-duration: 0.2s; border-radius: 100%; color: transparent; &.checked { background-color: $main-bg; border-color: $main-bg; color: #fff; } &.disabled { background-color: #ebedf0; border-color: #c8c9cc; } &.disabled-checked { color: #c8c9cc !important; } }