Authored by Lynnic

goods tags

... ... @@ -1060,7 +1060,7 @@
'navHome': 'sss ',
'navTitle': '商品详情'
},
'bannerTop': {
'list': [
{
... ... @@ -1069,6 +1069,25 @@
...
]
},
tags: [
{
is_new: true //NEW
},
{
is_discount: true //SALE
},
{
is_limited: false //限量商品
},
{
is_yohood: // YOHOOD
},
{
is_advance: true //再到着
}
],
'goodsName' : 'Stussy No. 4 BOX TEE ',
'goodsSubtitle' : '【全民拼抢购】经典印花T恤,满4件免一件!',
... ... @@ -1194,7 +1213,7 @@
...
]
},
'washTips' : {
'list' : [
{
... ... @@ -1220,6 +1239,7 @@
'cartInfo' : {
'numInCart' : 3,
'goodsInstore' : 0
'goodsInstore' : 0,
''
}
}
... ...
... ... @@ -30,7 +30,46 @@ $basicBtnC:#eb0313;
left: pxToRem(30px);
right: auto;
}
.tag-container{
position: absolute;
left: pxToRem(108px);
top: pxToRem(40px);
height: pxToRem(35px);
// width: pxToRem(70px);
color: #fff;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
z-index: 2;
.good-tag{
display: inline-block;
box-sizing: border-box;
margin-left: .5px;
font-size: pxToRem(23px);
text-align: center;
line-height: pxToRem(35px);
padding:0 8px;
}
.new-tag {
background-color: #78dc7e;
color: #fff;
}
.renew-tag {
background-color: #78dc7e;
color: #fff;
}
.sale-tag {
background-color: #ff575c;
color: #fff;
}
.new-festival-tag {
background-color: #000;
color: #fff;
}
.limit-tag {
border: 1px solid #000;
color: #000;
}
}
.good-detail-page {
overflow: hidden;
background-color: #f0f0f0;
... ... @@ -83,19 +122,6 @@ $basicBtnC:#eb0313;
position: relative;
background-color: #fff;
// overflow: hidden;
.is-new-lable {
position: absolute;
left: pxToRem(108px);
top: pxToRem(40px);
height: pxToRem(35px);
width: pxToRem(70px);
color: #fff;
text-align: center;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
background-color: #7cd881;
z-index: 2;
}
}
.banner-top {
// width: 100%;
... ...
... ... @@ -13,10 +13,8 @@
<div class="question">
<span class="iconfont">&#xe639;</span>
<p>
{{question}}
<span class="time">
{{time}}
</span>
{{question}}<br>
<span class="time">{{time}}</span>
</p>
</div>
... ...
{{> layout/header}}
<div class="good-detail-page yoho-page">
<div class="banner-container">
<h1 class="is-new-lable">NEW</h1>
<div class="tag-container">
{{# tags}}
{{# is_new}}
<p class="good-tag new-tag">NEW</p>
{{/ is_new}}
{{# is_advance}}
<p class="good-tag renew-tag">再到着</p>
{{/ is_advance}}
{{# is_discount}}
<p class="good-tag sale-tag">SALE</p>
{{/ is_discount}}
{{# is_yohoood}}
<div class="good-tag yohood-tag"></div>
{{/ is_yohoood}}
{{# is_limited}}
<p class="good-tag limit-tag">限量商品</p>
{{/ is_limited}}
{{/ tags}}
</div>
{{# bannerTop}}
{{> product/banner-swiper-arrow}}
{{/ bannerTop}}
... ...
... ... @@ -37,10 +37,9 @@
{{# consults}}
<div class="question">
<span class="iconfont">&#xe639;</span>
<p>{{question}}
<span class="time">
{{time}}
</span>
<p>
{{question}}
<span class="time">{{time}}</span>
</p>
</div>
... ...