Authored by biao

update for change the cart style. code review by LZF

.shopping-cart-good {
$cartRed: #d0253b;
position: relative;
padding-left: 16rem / $pxConvertRem;
... ... @@ -16,24 +17,28 @@
.info {
float: left;
margin-left: 50rem / $pxConvertRem;
margin-left: 30rem / $pxConvertRem;
padding: 16rem / $pxConvertRem 0;
border-bottom: 1px solid #e0e0e0;
padding-right: 20rem / $pxConvertRem;
}
.thumb {
float: left;
width: 120rem / $pxConvertRem;
height: 160rem / $pxConvertRem;
width: 180rem / $pxConvertRem;
height: 200rem / $pxConvertRem;
background-size: 100%;
background-repeat: no-repeat;
}
.deps {
margin-left: 135rem / $pxConvertRem;
padding-right: 20rem / $pxConvertRem;
margin-left: 173rem / $pxConvertRem;
padding-bottom: 60rem / $pxConvertRem;
border-bottom: 1px solid #e0e0e0;
}
.name {
font-size: 28rem / $pxConvertRem;
color: #5a5a5a;
}
.row:nth-child(2) {
... ... @@ -55,12 +60,14 @@
}
.appear-date {
color: #e01;
color: $cartRed;
display: block;
margin-top: 4rem / $pxConvertRem;
}
.price {
font-size: 24rem / $pxConvertRem;
color: #000;
color: $cartRed;
}
.count {
... ... @@ -78,7 +85,11 @@
border: none;
color: #fff;
text-align: center;
margin-left: 16rem / $pxConvertRem;
float: right;
margin-top: 20rem / $pxConvertRem;
margin-right: 16rem / $pxConvertRem;
border-radius: 20rem / $pxConvertRem;
padding: 4rem / $pxConvertRem;
}
.sold-out {
... ... @@ -86,7 +97,7 @@
}
.low-stocks {
background: #e01;
background: #7f7f7f;
}
.icon-del,
... ... @@ -141,3 +152,9 @@
}
}
}
.shopping-cart-good:last-child {
.deps {
border: none;
}
}
... ...
... ... @@ -17,11 +17,6 @@
</span>
{{/if}}
{{#if appearDate}}
<span class="appear-date">
上市期:{{appearDate}}
</span>
{{/if}}
</p>
<p class="row">
<span class="price">
... ... @@ -36,14 +31,23 @@
</span>
{{/if}}
<span class="iconfont icon-edit">&#xe61e;</span>
<span class="iconfont icon-del">&#xe621;</span>
</p>
<p class="row">
{{#if lowStocks}}
<span class="low-stocks">
库存不足
</span>
{{/if}}
<span class="iconfont icon-edit">&#xe61e;</span>
<span class="iconfont icon-del">&#xe621;</span>
</p>
<p class="row">
{{#if appearDate}}
<span class="appear-date">
上市期:{{appearDate}}
</span>
{{/if}}
</p>
</div>
</div>
... ...