/**index.wxss**/ .wrap{ min-height: 100vh; background: #f6f6f6; overflow: auto; } .wrap.limited{ height: 100vh; overflow: hidden; } .wrap_nr{ padding-bottom: 30rpx; } /* 商品 */ .shopcar_wrap{ padding-top: 30rpx; } .shopcar{ width: 690rpx; margin: 0 auto; background: #FFFFFF; } .shopcar .goods_list .goods_item .goods_tu{ width: 120rpx; height: 120rpx; border-radius: 5rpx; } .shopcar .goods_list .goods_item .goods_info{ display: flex; flex-direction: column; justify-content: space-between; } .goods_list .goods_del{ height: 100%; width: 130rpx; display: flex; align-items: center; justify-content: center; color: #FFFFFF; background: #EF3838; } /* 会员价 */ .goods_list .goods_item{ margin-top: 20rpx; padding: 30rpx; } .goods_list .goods_item:first-child{ margin-top: 0; } .goods_list .goods_item .goods_specs .price .vip{ padding: 4rpx 10rpx; font-size: 20rpx; /* font-weight: bold; */ background: #FFFFFF; border: 1px solid #F1A223; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #F1A223; } .guige .guige_b .guige_b_l .vip{ padding-left: 8rpx; } /* 合计 */ .heji_wrap{ width: 100%; height: 100rpx; padding: 0 30rpx; position: fixed; bottom: 0; left: 0; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; z-index: 10; } .heji_wrap .heji_r{ display: flex; align-items: center; } .heji_wrap .heji_btn{ width: 200rpx; height: 80rpx; margin-left: 30rpx; border-radius: 40rpx; background: #FFD102; display: flex; align-items: center; justify-content: center; } /* 规格 */ .guige_wrap{ width: 670rpx; border-radius: 10rpx 10rpx 0 0; margin: 0 auto; position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 15; } .guige{ width: 100%; padding-bottom: 38rpx; background: #FFFFFF; } .guige .goods_thumb_wrap{ width: 100%; /* height: 370rpx; */ position: relative; } .guige .goods_thumb_wrap .line{ width: 100%; height: 30rpx; position: absolute; bottom: 0; left: 0; background-repeat: repeat-x; background-size: 18rpx 30rpx; } .guige .goods_thumb{ width: 100%; height: auto; } .guige .goods_name{ padding: 20rpx 30rpx 0; font-size: 30rpx; color: #080808; display: flex; align-items: center; justify-content: space-between; } .guige .goods_labels{ padding: 0 30rpx; font-size: 24rpx; color: rgba(8,8,8,.54); display: flex; flex-wrap: wrap; } .guige .goods_labels .label{ padding: 6rpx; background: #F6F6F6; margin: 10rpx 14rpx 0 0; } .guige .goods_desc{ padding: 10rpx 30rpx 0; } .guige .goods_desc .goods_desc_name{ font-size: 26rpx; color: rgba(51,51,51,.54); } .guige .goods_desc .goods_desc_nr{ /* padding-top: 20rpx; */ font-size: 24rpx; color: rgba(8,8,8,.54); } .guige .goods_guige{ padding: 20rpx 30rpx 0; } .guige .goods_guige .goods_guige_name{ font-size: 26rpx; color: rgba(51,51,51,.54); } .guige .goods_guige .goods_guige_nr{ display: flex; flex-wrap: wrap; } .guige .guige_item{ height: 59rpx; font-size: 24rpx; color: #333333; background: #FFFFFF; border: 1rpx solid rgba(0, 0, 0, .12); border-radius: 5rpx; display: flex; align-items: center; margin: 20rpx 20rpx 0 0; } .guige .guige_item:last-child{ margin-right: 0; } .guige .guige_item .item_wenzi{ display: flex; } .guige .guige_item .item_wenzi text{ padding: 0 16rpx 0 12rpx; display: flex; align-items: center; } .guige .guige_item .item_wenzi text:not(:last-child)::after{ content: ""; display: block; width: 2rpx; height: 16rpx; background: rgba(0, 0, 0, .12); margin-left: 16rpx; } .guige .guige_item .price{ padding: 0 18rpx; font-size: 28rpx; border-left: 1rpx solid rgba(0, 0, 0, .12); } .guige .guige_item .price .unit{ font-size: 20rpx; } .guige .guige_item.selected{ background: #FFFBF0; border-color: #ED8C17; color: #ED8C17; } .guige .guige_item.selected .price{ color: #EA4335; border-left-color: #ED8C17; } .guige .guige_selected{ margin-top: 20rpx; height: 60rpx; background: #FAFAFA; border: 1rpx solid rgba(0, 0, 0, .05); border-left: 0 none; border-right: 0 none; padding: 0rpx 30rpx; display: flex; align-items: center; font-size: 26rpx; color: #000000; } .guige .guige_selected .label{ color: rgba(0,0,0,.54); } .guige .guige_b{ margin-top: 30rpx; padding: 0 30rpx; display: flex; align-items: center; justify-content: space-between; } .guige .guige_b .guige_b_l{ font-size: 26rpx; color: #000000; } .guige .guige_b .price{ font-size: 38rpx; color: #EA4335; padding-left: 10rpx; } .guige .guige_b .price .unit{ font-size: 22rpx; } .guige .guige_b .item{ font-size: 24rpx; color: rgba(0, 0, 0, .54); } .guige .guige_b .guige_b_r{ width: 350rpx; height: 90rpx; background: #D54C43; border-radius: 45rpx; font-size: 34rpx; color: #FFFFFF; display: flex; align-items: center; justify-content: center; } .guige_wrap .btn_close{ width: 100%; } .guige_wrap .btn_close .van-icon{ /* width: 56rpx; height: 56rpx; */ display: block; margin: 36rpx auto; } .guige_wrap .van-icon-cross{ position: absolute; top: 30rpx; right: 30rpx; } /* 无商品的提醒 */ .wrap_nr .tips{ position: absolute; top: 40vh; left: 0; width: 100%; text-align: center; } /* */ .goods_list .goods_item .goods_labels .label{ background: none; font-size: 24rpx; color: rgba(8,8,8,.54); margin: 0; } .goods_list .goods_item .goods_specs .price{ display: flex; align-items: center; } .goods_list .goods_item .goods_specs .price .vip{ margin-left: 20rpx; } /* */ .jiesuan_wrap{ padding: 30rpx 20rpx 36rpx; font-size: 26rpx; color: #000000; border-top: 1rpx solid rgba(0,0,0,.12); } .jiesuan_wrap .jiesuan_t .price{ padding-left: 10rpx; font-size: 34rpx; font-weight: bold; color: #D54C43; } .jiesuan_wrap .jiesuan_t .price .unit{ font-size: 24rpx; } .jiesuan_wrap .jiesuan_b{ display: flex; justify-content: flex-end; } .jiesuan_wrap .jieusan_btn{ width: 197rpx; height: 60rpx; background: #295C56; border-radius: 30rpx; font-size: 28rpx; color: #FFFEFE; display: flex; align-items: center; justify-content: center; } /* 换购 */ .huangou_wrap{ width: 690rpx; margin: 0 auto; } .huangou_wrap .title{ font-size: 30rpx; color: #000000; display: flex; align-items: center; margin-top: 28rpx; } .huangou_wrap .title::before{ content: ""; display: block; width: 6rpx; height: 28rpx; background: #295C56; margin-right: 10rpx; } .huangou_wrap .huangou_list{ display: flex; flex-wrap: wrap; } .huangou_wrap .huangou_list .huangou_item{ width: 210rpx; margin: 28rpx 28rpx 0 0; } .huangou_wrap .huangou_list .huangou_item:nth-of-type(3n){ margin-right: 0; } .huangou_item .goods_tu{ width: 210rpx; height: 210rpx; border-radius: 5rpx 5rpx 0rpx 0rpx; display: block; } .huangou_item .goods_info{ width: 100%; background: #FFFFFF; border-radius: 0 0 5rpx 5rpx; padding: 10rpx; } .huangou_item .goods_info .goods_title{ font-size: 24rpx; color: #080808; } .huangou_item .goods_info_b{ padding-top: 10rpx; display: flex; align-items: center; justify-content: space-between; } .huangou_item .ac_price{ font-size: 30rpx; color: #D54C43; } .huangou_item .ac_price .unit{ font-size: 20rpx; } .huangou_item .df_price{ font-size: 20rpx; color: rgba(8,8,8,.54); text-decoration: line-through; } .huangou_item .df_price .unit{ font-size: 14rpx; } .huangou_item .add_btn .van-icon{ color: #295C56; font-size: 35rpx; } .huangou_item .setp_w{ display: flex; justify-content: flex-end; } /* 商品列表 活动价*/ .goods_list .goods_item .goods_specs .price .df_price{ padding-left: 20rpx; font-size: 20rpx; color: rgba(8,8,8,.54); text-decoration: line-through; } /* 规格按钮 */ .guige_btn{ width: 120rpx; height: 45rpx; background: #295C56; border-radius: 23rpx; font-size: 26rpx; color: #FFFFFF; display: flex; align-items: center; justify-content: center; } /* */ .wrap_nr .tips.addPos{ top: 5vh; } .huangou_wrap.addTipPos{ margin-top: 10vh; } /* 加购标志 */ .add_tag{ font-size: 24rpx; color: #FFFFFF; background: linear-gradient(90deg, #FF6637, #FF954E); border-radius: 5rpx; padding: 6rpx 8rpx; margin-right: 12rpx; }