/* pages/snapUpDetail/snapUpDetail.wxss */ page{ height: 100%; overflow: hidden; background-color: #f8f8f8; } clearfix::after { display: block; content: ''; clear: both; } image { display: block; width: 100%; height: 100%; } .goods-img { width: 100%; height: 750rpx; } .display { display: none; } .sub { font-size: 26rpx; } /* 倒计时栏 */ .countdown-box { width: 100%; height: 85rpx; line-height: 85rpx; background: #04358D; color: #fff; padding: 0 30rpx; box-sizing: border-box; /* box-shadow: 0 -5rpx 10rpx 8rpx #e4e4e4; */ } .second-kill { font-size: 32rpx; } .countdown-content { float: right; font-size: 25rpx; height: 85rpx; line-height: 1em; text-align: left; } .countdown-tips { padding: 10rpx 0; font-size: 22rpx; opacity: 0.8; } .countdown-time { padding-top: 0rpx; } /* 商品信息 */ .goods-msg { position: relative; box-sizing: border-box; padding: 20rpx; margin-bottom: 20rpx; background-color: #fff; } .goods-title { font-size: 30rpx; } /* 价格 */ .goods-price { padding: 15rpx 0; border-bottom: 1px solid #f3f3f3; } .current-price { display: inline-block; color: #e43130; font-size: 34rpx; margin-right: 15rpx; vertical-align: middle; line-height: 1em; } .original { font-size: 23rpx; color: #888888; margin-top: 15rpx; } .original-price { display: inline-block; font-size: 28rpx; text-decoration: line-through; color: #999999; margin-left: 10rpx; vertical-align: middle; } /* 运费&库存 */ .other-infor { font-size: 23rpx; color: #aaa; padding-top: 15rpx; text-align: left; } .inventory { font-size: 26rpx; color: #777777; } /* 选择颜色 */ .choose-color { position: relative; padding: 20rpx; font-size: 30rpx; margin-bottom: 20rpx; background-color: #fff; } .more-icon { position: absolute; right: 20rpx; top: 50%; transform: translateY(-50%); display: block; width: 20rpx; height: 20rpx; } /* 店铺 */ .shop-box { position: relative; padding: 30rpx 20rpx; font-size: 28rpx; border-bottom: 1rpx solid #f2f2f2; margin-bottom: 90rpx; } .shop-icon { display: inline-block; width: 50rpx; height: 50rpx; margin-left: 20rpx; margin-right:30rpx; vertical-align: middle; } .shop-name { vertical-align: middle; } /* 评价 */ .estimate { border-top: 20rpx solid #f7f7f7; border-bottom: 20rpx solid #f7f7f7; font-size: 25rpx; padding: 25rpx 20rpx; text-align: left; margin-bottom: 150rpx; } .estimate-num { float: right; font-size: 23rpx; color: #999; } /** 商品详情 */ .prod-detail { background: rgb(255, 255, 255); margin-top: 20rpx; position: relative; line-height: 48rpx; overflow: hidden; padding: 20rpx 0; } rich-text { width: 100%!important; } .button-placeholder{ height: 150rpx; } .det-tit { width: 300rpx; } .detail-tit { font-size: 32rpx; position: relative; border-bottom: 1px solid #ddd; padding: 20rpx; } .prod-detail image { width: 750rpx !important; display: block; } rich-text image { width: 100% !important; } img { width: 100% !important; display: block; } /** end 商品详情 */ /* 立即抢购 */ .buynow { position: fixed; bottom: 0; left: 0; width: 100%; margin-top: 80rpx; padding: 0 20rpx; box-sizing: border-box; background: #fff; } .buynow-btn { display: block; text-align: center; color: #fff; font-size: 30rpx; background: #04358D; width: 100%; line-height: 90rpx; margin-top: 20rpx; margin-bottom: 20rpx; border-radius: 60rpx; } /* 零售价goumai */ .retail-price-buy { background: #ff8854; } /** 底部按钮 */ .foot-box { margin-top: 100rpx; } .footer { position: fixed; bottom: 0; width: 100%; box-sizing: border-box; height: 90rpx; background: #fff; box-shadow: 10rpx 0 10rpx 0 #f0f0f0; } .foot-btn { display: inline-block; width: 125rpx; font-size: 20rpx; color: #666; text-align: center; padding-top: 8rpx; background: #fff; } .foot-btn > image { display: block; width: 50rpx; height: 50rpx; margin: 0 auto; } .buy-btn { display: inline-block; font-size: 30rpx; height: 90rpx; line-height: 95rpx; vertical-align: top; width: 33.3%; color: #fff; text-align: center; } .alone-buy { background: #fe8854; } .group-buy { background: #fe4443; } /** end 底部按钮 */ /* 弹框 */ /*模态框*/ .modals{ position:fixed; z-index: 999; top:0; left: 0; right:0; bottom: 0; } .modals-cancel{ position:absolute; z-index:190; top:0; left: 0; right:0; bottom: 0; background-color: rgba(0,0,0,.5); } .bottom-dialog-body { position:absolute; z-index:200; bottom:0; left:0; right:0; max-height: 80%; background-color: #fff; } /*动画前初始位置*/ .bottom-pos{ -webkit-transform:translateY(100%); transform:translateY(100%); } /* 上部内容 */ .top-content { position: relative; border-bottom: 1px solid #f2f2f2; font-size: 26rpx; padding: 20rpx; } .top-content-img-box { display: inline-block; width: 150rpx; height: 150rpx; background: #f2f2f2; vertical-align: middle; } .top-content-img-box > image { width: 100%; height: 100%; } .goods-msg-box { display: inline-block; width: 70%; margin-left: 20rpx; vertical-align: middle; } .goods-names { line-height: 1.5em; color: #000; font-size: 30rpx; padding-right: 15rpx; display: -webkit-box; -webkit-line-clamp: 2; /*设定显示行数*/ -webkit-box-orient: vertical; word-break: break-all; overflow: hidden; text-overflow: ellipsis; text-align: justify; } .group-tips { font-size: 20rpx; color: #e43130; padding: .3em 0; padding-top: 0; } .goods-prices { font-size: 30rpx; color: #e43130; margin-top: 5rpx; } .rmb-symbol { font-size: 34rpx; } .close-btn { position: absolute; display: block; right: 20rpx; top: 15rpx; width: 40rpx; height: 40rpx; z-index: 250; } .close-btn > image { width: 100%; height: 100%; } .sku-selectbox { max-height: 550rpx; overflow-y: scroll; } /* 颜色选择 */ .choose-color-box { padding: 20rpx; font-size: 25rpx; border-bottom: 1px solid #f2f2f2; } .color-txt { font-weight: 600; margin-bottom: 15rpx; } .color-box { display: block; box-sizing: border-box; padding: 8rpx 0; } .color-item { display: inline-block; padding: 0 16px; max-width: 270px; overflow: hidden; line-height: 2em; text-align: center; margin-left: 10px; margin-bottom: 10px; color: #333; background-color: #f7f7f7; font-size: 24rpx; border:1px solid #aaa; border-radius: 60rpx; } .color-item.gray{ background-color: #f9f9f9; color: #ddd; } .color-item.dashed{ border:1px dashed #ccc; } .color-item-current { background: #04358D; color: #fff; border:1px dashed #04358D !important; } /* 数量选择 */ .quantity { position: relative; padding: 20rpx; font-size: 28rpx; border-bottom: 1px solid #f2f2f2; margin-bottom: 180rpx; } .left-text { line-height: 1.5em; } .left-text-bottom { font-size: 25rpx; color: #666666; } .left-text-bottom-max-num{ color: #f00; } /* choose-quantity */ .right-choose { position: absolute; right: 1em; top: 1em; } .subtract, .show-num, .add { display: inline-block; background: #f5f5f5; color: #cfcfcf; padding: 14rpx 18rpx; width: 25rpx; height: 25rpx; line-height: 25rpx; text-align: center; } .show-num { margin: 0 3rpx; } .current-state { background: #ebebeb; color: #6d6d6e; } /* 确认按钮 */ .confirm-btn { position: fixed; bottom: 0; left: 0; width: 100%; display: flex; flex-direction: row nowrap; height: 110rpx; z-index: 6; } .confirm-btn .confirm { position: relative; display: flex; flex-grow: 1; justify-content: center; align-items: center; background-color: #fff; font-size: 30rpx; flex-flow: column; border-radius: 60rpx; height: 2.8em; width: 45%; margin: 0 15rpx; background: #04358D; color: #fff; } .confirm-btn.gray, .confirm.gray { background:#ddd; } /* 底部弹框end */ /* 悬浮按钮 */ .suspension-box { position: fixed; top:860rpx; right:40rpx; z-index: 11; } .scroll-top { top: 780rpx; } .suspension-btn { display: flex; justify-content: center; align-items: center; text-align: center; width: 80rpx; height: 80rpx; border-radius: 50%; background: #fff; border: 1rpx solid #ccc; margin-top: 30rpx; } button.btn-type { background: #fff; padding: 0; margin: 0; margin-top: 30rpx; } button.btn-type::after { border: 0; } .suspension-btn image { display: block; width: 40rpx; height: 40rpx; } /* /悬浮按钮 */