Authored by yyq

购物袋列表

... ... @@ -47,6 +47,26 @@
购物袋
</a>
<div class="mini-bag-box sub-wrapper">
<div class="bag-goods bag-empty">
<dl class="mini-goods-list">
<dd class="goods-item clearfix">
<div class="thumb">
<img src="//placehold.it/48x64">
</div>
<div class="info">
<a href="">范德萨发生大幅度是</a>
<p>颜色:黄 尺码:F</p>
</div>
<div class="price">
<p>¥199.00 X1</p>
<a href="#">删除</a>
</div>
</dd>
</dl>
<div class="go-bag-btn">
<a href="{{../siteUrl}}/shopping/cart">去购物车结算</a>
</div>
</div>
<div class="bag-content">
购物袋空空的哦,去看看心仪的商品吧~
</div>
... ...
... ... @@ -78,6 +78,10 @@
cursor: default;
}
&:hover > a {
color: #9a9a9a;
}
&:hover .sub-wrapper {
display: block;
}
... ... @@ -144,7 +148,7 @@
width: 370px;
padding: 18px;
border: 1px solid #eee;
background: #fff resolve('layout/bag-bg.png') no-repeat center center;
background: #fff;
position: absolute;
z-index: 50;
right: 0;
... ... @@ -154,8 +158,55 @@
padding: 280px 0 130px;
text-align: center;
color: #1d1d1d;
background: resolve('layout/bag-bg.png') no-repeat center center;
display: none;
}
.bag-goods {
background: #fff;
}
.go-bag-btn {
font-size: 20px;
line-height: 1;
padding-top: 24px;
border-top: 1px solid #ddd;
text-align: center;
}
.bag-empty {
display: none;
}
.bag-empty + .bag-content {
display: block;
}
}
.goods-item {
line-height: 2;
padding: 6px 0;
color: #1d1d1d;
font-size: 14px;
& > * {
float: left;
}
.thumb {
width: 58px;
height: 64px;
}
.info {
width: 160px;
padding-left: 10px;
}
.price {
width: 100px;
text-align: right;
}
}
}
}
... ...