<view class="btm_tool">
<view class="tool_item">
<view class="iconfont icon-kefu"></view>
<view> 联系客服 </view>
<button open-type="contact"></button>
</view>
<view class="tool_item">
<view class="iconfont icon-share-line"></view>
<view> 分享 </view>
<button open-type="share"></button>
</view>
<navigator class="tool_item"
open-type="switchTab"
url="/pages/cart/index" >
<view class="iconfont icon-gouwuche"></view>
<view> 购物车 </view>
</navigator>
<view class="tool_item btn_cart">
<view> 加入购物车 </view>
</view>
<view class="tool_item btn_buy">
<view> 立即购买 </view>
</view>
</view>
/* pages/goods_detail/index.wxss */
page {
padding-bottom: 90rpx;
}
.detail_swiper swiper {
height: 60vw;
text-align: center;
}
.detail_swiper swiper image {
width: 60%;
}
.goods_price {
padding: 15rpx;
font-size: 32rpx;
font-weight: 600;
color: var(--themeColor);
}
.goods_name_row {
border-top: 5rpx solid #dedede;
border-bottom: 5rpx solid #dedede;
padding: 10rpx 0;
display: flex;
}
.goods_name_row .goods_name {
flex: 5;
color: #000;
font-size: 30rpx;
padding: 0 10rpx;
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.goods_name_row .goods_collect {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-left: 1px solid #000;
}
.goods_info .goods_info_title {
font-size: 32rpx;
color: var(--themeColor);
font-weight: 600;
padding: 20rpx;
}
.btm_tool {
border-top: 1px solid #ccc;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 90rpx;
background-color: #fff;
display: flex;
}
.btm_tool .tool_item {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 24rpx;
position: relative;
}
.btm_tool .tool_item button {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
}
.btm_tool .btn_cart {
flex: 2;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #ffa500;
color: #fff;
font-size: 30rpx;
font-weight: 600;
}
.btm_tool .btn_buy {
flex: 2;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #eb4450;
color: #fff;
font-size: 30rpx;
font-weight: 600;
}
