fe / yohobuy-node · Commits

Go to a project

Authored by OF1706
Commit d01d510120c37fbedccabc212c22d65da5b2aad5 1 parent 5710e410

m

Inline Side-by-side
Showing 4 changed files with 244 additions and 138 deletions
... ... @@ -68,20 +68,22 @@
</div>
<div class="dl choose-size">
<div class="dd">尺码:</div>
<div class="dt active">
<div class="choose-size-detail">
<div class="dt active">
40
</div>
<div class="dt">
</div>
<div class="dt">
42
</div>
<div class="dt">
</div>
<div class="dt">
44
</div>
<div class="dt">
</div>
<div class="dt">
46
</div>
<div class="dt disabled">
</div>
<div class="dt disabled">
48
</div>
</div>
</div>
<div class="button-group">
... ...
... ... @@ -28,91 +28,156 @@
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
<li class="img-item">
<span class="hide goods-id">{{goods_id}}</span>
<div class="good">
<a href="{{url}}" target="_blank">
<img class="lazy" src="{{pic_url}}"/>
</a>
</div>
</li>
</ul>
</div>
</div>
<div class="detail-bigpic">
<div class="bigpic">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="piclist">
<span class="pre"></span>
<div class="con">
<ul>
<li class="active"><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
</ul>
</div>
<span class="next"></span>
</div>
</div>
<div class="detail-bigpic none">
<div class="bigpic">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="piclist">
<span class="pre"></span>
<div class="con">
<ul>
<li class="active"><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
</ul>
</div>
<span class="next"></span>
<div class="detail-goods">
<div class="detail-bigpic">
<div class="bigpic">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="piclist">
<span class="pre"></span>
<div class="con">
<ul>
<li class="active"><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
</ul>
</div>
<span class="next"></span>
</div>
</div>
</div>
<div class="detail-info">
<div class="title">
<h2>哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈{{name}}</h2>
<div class="detail-bigpic none">
<div class="bigpic">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="bigpic none">
<img src="">
</div>
<div class="piclist">
<span class="pre"></span>
<div class="con">
<ul>
<li class="active"><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
<li><img src=""></li>
</ul>
</div>
<span class="next"></span>
</div>
</div>
<div class="price">
<div class="detail-info">
<div class="title">
<h2>哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈{{name}}</h2>
</div>
<div class="price">
<span class="newprice">现价：<b class="promotion-price">¥7777{{salePrice}}</b></span>
<span class="activityprice">活动价：<b class="promotion-price">¥5555{{marketPrice}}</b></span>
</div>
<div class="order">
<dl>
<dd class="colorBox">选颜色：</dd>
<dt>
<div class="colorBox">
<ul>
</div>
<div class="order">
<dl>
<dd class="colorBox">选颜色：</dd>
<dt>
<div class="colorBox">
<ul>
<li class="color active">
<p class="{{#if focus}}atcive{{/if}}"><span></span><img src=""></p>
<span>{{name}}</span>
... ... @@ -121,64 +186,66 @@
<p class="{{#if focus}}atcive{{/if}}"><span></span><img src=""></p>
<span>{{name}}</span>
</li>
</ul>
</div>
</dt>
</dl>
<dl>
<dd class="showSizeBox">选尺码：</dd>
<dt>
<div class="showSizeBox">
</ul>
</div>
</dt>
</dl>
<dl>
<dd class="showSizeBox">选尺码：</dd>
<dt>
<div class="showSizeBox">
<span data-sku="{{sku}}" data-num="{{num}}" class="disabled">40码{{name}}</span>
<span data-sku="{{sku}}" data-num="{{num}}">40码{{name}}</span>
<span data-sku="{{sku}}" data-num="{{num}}">40码{{name}}</span>
<span data-sku="{{sku}}" data-num="{{num}}">40码{{name}}</span>
</div>
<p>内长&nbsp;25.5com</p>
</dt>
</dl>
<dl>
<dd>选件数：</dd>
<dt>
<div class="amount_wrapper">
<input type="text" id="num" class="num" value="1" readonly="readonly">
<i class="amount cut"></i>
<i class="amount add"></i>
</div>
</dt>
</dl>
<dl>
<dd>选件数：</dd>
<dt>
<div class="amount_wrapper">
<input type="text" id="num" class="num" value="1" readonly="readonly">
<i class="amount cut"></i>
<i class="amount add"></i>
</div>
</dt>
</dl>
</div>
<div class="submit">
<button class="btn-red"><i class="addCart"></i>添加到购物车</button>
<button class="btn-favCount"><i class="favCount"></i>收藏商品</button>
</dt>
</dl>
</div>
<div class="submit">
<button class="btn-red"><i class="addCart"></i>添加到购物车</button>
<button class="btn-favCount"><i class="favCount"></i>收藏商品</button>
</div>
</div>
</div>
<div class="detail-size">
<h3>尺码信息（单位：厘米）</h3>
<table>
<thead>
<tr>
<div class="detail-size">
<h3>尺码信息（单位：厘米）</h3>
<table>
<thead>
<tr>
<th width="{{width}}">吊牌吃吗</th>
<th width="{{width}}">吊牌吃吗</td>
<th width="{{width}}">吊牌吃吗</td>
<th width="{{width}}">吊牌吃吗</td>
<th width="{{width}}">吊牌吃吗</td>
<th width="{{width}}">吊牌吃吗</td>
</tr>
</thead>
<tbody>
</tr>
</thead>
<tbody>
<tr>
<td>6666{{.}}</td>
<td>6666{{.}}</td>
</tr>
<tr>
<td>4444{{.}}</td>
<td>4444{{.}}</td>
</tr>
</tbody>
</table>
<div class="size-info">
※ 以上尺寸为实物实际测量，因测量方式不同会有略微误差，相关数据仅作参考，以收到实物为准。
</tbody>
</table>
<div class="size-info">
※ 以上尺寸为实物实际测量，因测量方式不同会有略微误差，相关数据仅作参考，以收到实物为准。
</div>
</div>
</div>
</div>
<input value="{{addToCart}}" id="addToCart" type="hidden" />
... ...
... ... @@ -19,6 +19,7 @@
padding: 15px;
margin: 0 auto;
*zoom: 1;
box-sizing: border-box;
&:after{
content:'';
display: block;
... ... @@ -31,6 +32,17 @@
}
}
.detail-goods {
*zoom: 1;
&:after{
content:'';
display: block;
height: 0;
clear: both;
overflow: hidden;
}
}
.detail-bigpic {
width: 180px;
padding-bottom: 30px;
... ... @@ -161,6 +173,7 @@
display: block;
clear: both;
height: auto;
overflow: hidden;
}
}
dd {
... ... @@ -172,7 +185,6 @@
dt {
width: 300px;
float: left;
padding-bottom: 15px;
text-align: left;
}
dd.colorBox {
... ... @@ -181,6 +193,16 @@
dd.showSizeBox {
line-height: 23px;
}
dt.showSizeBox {
*zoom: 1;
&:after {
content: '';
display: block;
clear: both;
height: auto;
overflow: hidden;
}
}
.colorBox {
&>ul {
... ... @@ -225,10 +247,11 @@
.showSizeBox{
span {
cursor: pointer;
min-width:38px;
height: 23px;
min-width: 29px;
text-align: center;
line-height: 23px;
padding: 0px 12px;
padding: 0px 4px;
border: 1px #f5f6f5 solid;
margin: 1px 5px 5px 1px;
display: inline;
... ... @@ -370,6 +393,12 @@
}
}
}
.side-img-dd {
height: 90px;
overflow: hidden;
}
.slide-img {
margin-bottom: 25px;
p {
... ... @@ -407,21 +436,28 @@
height: 100%;
li {
float: left;
width: 232px;
height: 410px;
width: 65px;
height: 90px;
border: 1px solid #e9e9e9;
box-sizing: border-box;
overflow: hidden;
margin-right: 20px;
&:nth-child(7n){
margin-right: 0;
}
}
.good {
float: left;
width: 225px;
margin-right: 10px;
width: 65px;
a {
cursor: pointer;
border: none;
display: block;
}
img {
display: block;
width: 222px;
height: 300px;
width: 65px;
height: 90px;
}
}
}
... ...
... ... @@ -924,10 +924,14 @@
.choose-size {
margin-bottom: 13px;
min-height: 56px;
.dd{
.dd {
height:18px;
line-height:18px;
}
.choose-size-detail {
float: left;
width: 128px;
}
.dt {
padding-left: 6px;
padding-right: 6px;
... ... @@ -937,9 +941,6 @@
text-align: center;
line-height: 16px;
margin-bottom: 10px;
&:nth-child(5n) {
margin-left: 37px;
}
}
.active {
border-color: #000;
... ...