.nav-mask { position: fixed; z-index: 999; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5); display: none; } .picker-modal { background: #fefefe; height: 260px; position: fixed; bottom: -2rem; left: 0; right: 0; z-index: 1000; transform: translate3d(0,100%,0); } .picker-modal.city-picker { z-index: 2000; } .picker-modal.in { transition-duration: 300ms; transform: translate3d(0,0,0); bottom: 0; } .picker-modal.out { transition-duration: 300ms; transform: translate3d(0,100%,0); } .picker-modal .picker-control { display: flex; align-items: center; height: 40px; border-bottom: 1px solid #f1f1f1; padding: 0 30rpx; font-size: 32rpx; } .picker-modal .picker-control .cancel { width: 50%; text-align: left; color: #666; } .picker-modal .picker-control .confirm { width: 50%; text-align: right; color: #20b21f; } .picker-modal .picker { width: 100%; height: 220px; } .picker-modal .picker .item { line-height: 40px; } picker-view-column { text-align: center; } .coupon-picker { background: #f5f5f5; } .coupon-picker,.gift-picker { max-height: 880rpx; -webkit-overflow-scrolling: touch; width: 100%; padding-bottom: 76rpx; z-index: 1001; } .coupon-picker .coupontitle,.gift-picker .gifttitle { font-size: 28rpx; color: #666; line-height: 100rpx; border-bottom: 1px solid #e5e5e5; padding-left: 20rpx; padding-right: 20rpx; } .coupon-picker .coupontitle text { font-size: 40rpx; } .coupon-picker .option-picker-inner { background: #f5f5f5; border-top: 1px solid #eee; box-shadow: 0 0 8rpx rgba(0,0,0,0.1); } .fui-navbar,.fui-footer { position: fixed; width: 100%; bottom: 0; height: 98rpx; background: #fff; box-shadow: 0 0 4px rgba(0,0,0,0.1); } .coupon-list { height: auto; padding: 0 20rpx 80rpx 20rpx; overflow: auto; max-height: 700rpx; } .coupon-item { margin-top: 20rpx; background: #ffffff; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; position: relative; overflow: hidden; height: 140rpx; } .coupon-dots { height: inherit; width: 16rpx; position: absolute; top: 0; left: -10rpx; z-index: 10; } .coupon-dots i { height: 16rpx; width: 16rpx; border-radius: 16rpx; background: #f5f5f5; display: block; } .coupon-dots:before,.coupon-dots:after { content: ""; height: 20rpx; width: 20rpx; background: #f5f5f5; border-radius: 20rpx; position: absolute; left: 210rpx; } .coupon-dots:before { top: -10rpx; } .coupon-dots:after { bottom: -10rpx; } .coupon-item .coupon-left { height: inherit; width: 210rpx; background: #55b5ff; color: #fff; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; justify-content: center; } .coupon-item .coupon-left .single { font-size: 60rpx; } .coupon-item .coupon-left .subtitle { font-size: 24rpx; } .coupon-item .coupon-right { padding: 20rpx; -webkit-box-flex: 1; flex: 1; } .coupon-item .coupon-right .title { font-size: 32rpx; height: 48rpx; line-height: 48rpx; color: #1a1a1a; overflow: hidden; } .coupon-item .coupon-right .usetime { line-height: 56rpx; font-size: 24rpx; color: #999; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .coupon-item .coupon-right .usetime .text { -webkit-box-flex: 1; flex: 1; } .coupon-list.mini .coupon-item .coupon-after { width: 160rpx; padding-right: 20rpx; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; justify-content: center; } .coupon-list.mini .coupon-item .coupon-after .coupon-btn { width: 140rpx; height: 60rpx; line-height: 60rpx; border: 1px solid #55b5ff; border-radius: 60rpx; color: #55b5ff; text-align: center; font-size: 24rpx; } .coupon-item.pink .coupon-left,.coupon-item.pink .coupon-type { background: #fd72d4; } .coupon-item.pink .coupon-after .coupon-btn { border-color: #fd72d4; color: #fd72d4; } .coupon-list.mini .coupon-item.red .coupon-left,.coupon-item.red .coupon-type { background: #fd5554; } .coupon-list.mini .coupon-item.red .coupon-after .coupon-btn { border-color: #fd5554; color: #fd5554; } .coupon-list.mini .coupon-item.org .coupon-left,.coupon-item.red .coupon-type { background: #ff913f; } .coupon-list.mini .coupon-item.org .coupon-after .coupon-btn { border-color: #ff913f; color: #ff913f; } .option-picker { height: auto; width: 100%; z-index: 1001; } .goods-picker .option-picker-options { height: 600rpx; } .option-picker .option-picker-cell { padding: 8rpx 20rpx 20rpx 20rpx; } .option-picker .option-picker-options { margin: 0; padding: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; height: 750rpx; } .option-picker .option-picker-cell.goodinfo { padding-left: 220rpx; padding-top: 20rpx; position: relative; } .option-picker .option-picker-cell.goodinfo:after,.option-picker .option-picker-cell.option:after { content: " "; position: absolute; bottom: 0; left: 20rpx; right: 20rpx; border-bottom: 1px solid #eee; } .option-picker .option-picker-cell.goodinfo .closebtn { width: 44rpx; height: 44rpx; position: absolute; top: 20rpx; right: 20rpx; text-align: center; line-height: 44rpx; color: #999; } .option-picker .option-picker-cell.goodinfo .closebtn .icon { font-size: 61rpx; } .option-picker .option-picker-cell.goodinfo .img { height: 168rpx; width: 168rpx; background: #fff; padding: 4rpx; border: 1px solid #eee; border-radius: 2px; position: absolute; top: -50rpx; left: 20rpx; box-shadow: 0 0 8rpx rgba(0,0,0,0.1); } .option-picker .option-picker-cell.goodinfo .img img { height: 100%; width: 100%; } .option-picker .option-picker-cell.goodinfo .info { font-size: 28rpx; height: 37rpx; line-height: 37rpx; } .option-picker .option-picker-cell.goodinfo .info-total { font-size: 26rpx; color: #999; } .option-picker .option-picker-cell.goodinfo .info-price .price { font-size: 32rpx; } .option-picker .option-picker-cell.goodinfo .info-titles { font-size: 26rpx; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .option-picker .option-picker-cell.option { position: relative; } .option-picker .option-picker-cell.option .title { font-size: 28rpx; height: auto; overflow: hidden; color: #000; line-height: 78rpx; } .option-picker .option-picker-cell.option .select { font-size: 29rpx; color: #666; height: auto; overflow: hidden; } .option-picker .option-picker-cell.option .select .nav { height: auto; width: auto; border: 0; float: left; margin: 16rpx 20rpx 0 0; } .option-picker .option-picker-cell .fui-number { float: right; } .option-picker .fui-navbar { text-shadow: none; height: 90rpx; } .option-picker .fui-navbar .btn { border: none; font-size: 29rpx; color: #fff; border-radius: 0; padding: 0; margin: 0; height: 100%; line-height: 90rpx; } .option-picker .fui-navbar .cartbtn { background: #fe9402; } .option-picker .fui-navbar .buybtn,.option-picker .fui-navbar .confirmbtn { background: #fd5555; } .option-picker-inner { background: #fff; border-top: 2rpx solid #eee; box-shadow: 0 0 8rpx rgba(0,0,0,0.1); } .option-picker .fui-navbar .btn.disabled { color: #ccc; background: #ececec; } .option-picker .diyform-container:before { display: none; } .option-picker .fui-number { backface-visibility: hidden; box-sizing: border-box; position: relative; display: flex; font-size: 33rpx; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0; height: 61rpx; width: 205rpx; } .option-picker .fui-number:before { content: " "; position: absolute; z-index: 2; top: 0; left: 0; right: 0; border-top: 2rpx solid #d9d9d9; } .option-picker .fui-number:after { content: " "; position: absolute; z-index: 2; bottom: 0; left: 0; right: 0; border-top: 1px solid #d9d9d9; } .option-picker .fui-number .num { -webkit-box-flex: 1; flex: 1; height: 61rpx; overflow: hidden; line-height: inherit; color: #666; text-align: center; border: 0; font-size: 28rpx; } .option-picker .fui-number .minus,.option-picker .fui-number .plus { height: inherit; width: 61rpx; font-size: 41rpx; font-weight: bold; color: #999; position: relative; text-align: center; line-height: 61rpx; background: #f7f7f7; z-index: 1; } .option-picker .fui-number .minus:before,.option-picker .fui-number .plus:before { content: " "; position: absolute; top: 0; left: 0; bottom: 0; border-left: 1px solid #d9d9d9; } .option-picker .fui-number .minus:after,.option-picker .fui-number .plus:after { content: " "; position: absolute; top: 0; right: 0; bottom: 0; border-right: 1px solid #d9d9d9; } .option-picker .fui-number .minus.disabled,.option-picker .fui-number .plus.disabled { background: #fff; color: #ebebeb; } .option-picker .fui-number.small { height: 40rpx; width: 128rpx; } .option-picker .fui-number.small .minus,.option-picker .fui-number.small .plus { width: 41rpx; line-height: 41rpx; font-size: 31rpx; } .fui-modal.goodslist { position: fixed; max-height: 780rpx; width: 660rpx; top: 50%; left: 50%; transform: translate(-50%,-55%); bottom: auto; } .fui-modal.goodslist .option-picker .option-picker-inner { margin: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; height: auto; max-height: 640rpx; overflow: hidden; border-top-left-radius: 12rpx; border-top-right-radius: 12rpx; padding: 30rpx; } .fui-modal.goodslist .option-picker .option-picker-options { max-height: 440rpx; overflow: auto; height: auto; } .fui-modal.goodslist .fui-navbar { padding: 30rpx 0; position: static; border-bottom-left-radius: 12rpx; border-bottom-right-radius: 12rpx; text-align: center; } .fui-modal.goodslist .option-picker .fui-navbar .btn { width: 290rpx; border: none; font-size: 29rpx; color: #fff; border-radius: 10rpx; padding: 0; margin: 0; height: 84rpx; line-height: 84rpx; display: inline-block; } .fui-modal.goodslist .option-picker .fui-navbar .btn.cartbtn { margin-right: 20rpx; } .fui-modal.goodslist .option-picker-cell.goodinfo { position: static; display: flex; padding-left: 30rpx; } .fui-modal.goodslist .option-picker .option-picker-cell.goodinfo .img { position: static; } .fui-modal.goodslist .option-picker .option-picker-cell.goodinfo:after,.option-picker .option-picker-cell.option:after { border: none; } .fui-modal.goodslist .fui-list { background: #f7f7f7; } .fui-modal.goodslist .fui-list-inner { display: flex; flex-direction: column; justify-content: space-between; height: 100rpx; } .fui-modal.goodslist .fui-list-inner .subtitle { font-size: 28rpx; } .fui-modal.goodslist .fui-list-inner .price { font-size: 30rpx; line-height: 30rpx; color: #ff5555; } .fui-modal.goodslist .option-picker .fui-navbar .cartbtn { color: #333; border: 1px solid #e5e5e5; background: #fff; } .gift-list-group { padding: 0 15rpx; height: auto; overflow: auto; max-height: 700rpx; } .gift-list .radio { height: 106rpx; line-height: 106rpx; color: #ff5555; vertical-align: middle; font-size: 24rpx; margin-left: 20rpx; } .gift-list .wx-radio-input { display: inline-block; width: 40rpx; height: 40rpx; } .gift-list .fui-list { margin-bottom: 5rpx; } .gift-list .fui-list:before { border: none; } .gift-list .fui-list .fui-list-inner .subtitle { font-size: 24rpx; color: #000; line-height: 50rpx; } .gift-list .fui-list .fui-list-inner .row .row-text { font-size: 24rpx; color: #999; text-decoration: line-through; } .gift-list .row-remark { text-align: right; position: relative; flex-shrink: 0; padding-left: 25rpx; font-size: 24rpx; color: #000; line-height: 1.5; } .gift-list .row-remark view { text-decoration: line-through; } .gift-list .fui-list .fui-list-inner .subtitle2 { font-size: 22rpx; color: #999; } .gift-list .fui-navbar.btn { border: 0; } .act-cell { padding: 0 36rpx; margin-top: 40rpx; } .act-cell-title { font-size: 28rpx; color: #333; } .act-tips { display: inline-block; width: 18rpx; height: 18rpx; border: 1px solid #ff5555; transform: rotate(45deg); margin-right: 26rpx; } .act-cell-inner { font-size: 24rpx; color: #999; line-height: 28rpx; padding-left: 55rpx; margin-top: 20rpx; } .goods-picker .option-Commission { display: none; vertical-align: middle; margin-top: -12rpx; padding: 0 20rpx; height: 44rpx; line-height: 44rpx; border-radius: 44rpx; color: #fff; font-size: 20rpx; margin-left: 20rpx; background: linear-gradient(to right,#f0b938 0%,#f09938 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#fff0b938, endColorstr=#fff09938,gradientType='1'); } .goods-picker .option-Commission.show { display: inline-block!important; }