fe / yohobuywap-node · Commits

Go to a project

Authored by 郝肖肖
Commit 30d381f44ef0ab905f6b6b50d5e1aba644bbf644 1 parent 019e740b

潮流优先首页

Inline Side-by-side
Showing 5 changed files with 263 additions and 3 deletions
... ... @@ -14,8 +14,7 @@ const plusstarModel = require(`${mRoot}/plusstar`);
*/
let index = (req, res) => {
res.render('plusstar/index', {
module: 'plusstar',
page: 'index',
page: 'plusstar-index',
title: '潮流优选'
});
};
... ...
4444444444444t666
\ No newline at end of file
<div class='plusstar-page'>
<div class="channel-tab">
<div class="channel">
<span class="name">男生</span>
</div>
<div class="channel">
<span class="name">女生</span>
</div>
<div class="channel">
<span class="name">生活</span>
</div>
</div>
<!--/ channel-tab-->
<div class="resources">
<div class="header-title">
新品抢先看
<a class="more" href="/new">···</a>
</div>
<div class="title-image">
<a class="image" href="http://m.yohoblk.com//brands">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/15/019a301e1c1c2cb233d71e8853275bb4b0.png?imageView2/2/w/750/h/364">
</a>
</div>
<div class="header-title">
经典品牌
<a class="more" href="http://m.yohoblk.com/brand">···</a>
</div>
<div class="title-image">
<a class="image" href="jdpp.yoho">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/15/01e84b9b4946444cc8287437f82e9fe08e.png?imageView2/2/w/750/h/364">
</a>
</div>
<div class="focus-left-right">
<a href="list.pp" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/15/0184e6dc50a9b58e271da4997de7b3cbbc.png?imageView2/2/w/250/h/250">
</a>
<a href="pp2" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/15/01c5da274eeddb5b00b95b7479af3436cc.png?imageView2/2/w/250/h/250">
</a>
<a href="pp3" title="">
<img lazy="loaded" src="http://img11.static.yhbimg.com/yhb-img01/2016/07/18/15/0168483eb410b255504a27ff198991e54b.png?imageView2/2/w/250/h/250">
</a>
</div>
<!--/focus-left-right-->
<div class="header-title">
热门品类
<a class="more" href="http://m.yohoblk.com/brand">···</a>
</div>
<div class="recommend-content-five">
<a href="http://m.yohoblk.com/product/shop?domain=sctest1" title="">
<img lazy="loaded" src="http://img11.static.yhbimg.com/yhb-img01/2016/07/18/16/011bb0c89f2d3b167f03bd51f7df150d1f.png?imageView2/2/w/375/h/375">
</a>
<a href="http://m.yohoblk.com/product/new" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/16/01a21d6a9cf727b5d29219be984427b4a3.png?imageView2/2/w/375/h/375">
</a><a href="http://m.yohoblk.com/product/new" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/16/01a21d6a9cf727b5d29219be984427b4a3.png?imageView2/2/w/375/h/375">
</a><a href="http://m.yohoblk.com/product/new" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/16/01a21d6a9cf727b5d29219be984427b4a3.png?imageView2/2/w/375/h/375">
</a><a href="http://m.yohoblk.com/product/new" title="">
<img lazy="loaded" src="http://img10.static.yhbimg.com/yhb-img01/2016/07/18/16/01a21d6a9cf727b5d29219be984427b4a3.png?imageView2/2/w/375/h/375">
</a>
</div>
<div class="header-title">
热门商品
<a class="more" href="http://m.yohoblk.com/list">···</a>
</div>
<div class="goods">
<!--商品--->
</div>
</div><!--/resources-->
</div><!--/plusstar-page-->
\ No newline at end of file
... ...
@import "star/index";
@import "plusstar/index";
... ...
.plusstar-page {
position: relative;
margin-right: auto;
margin-left: auto;
width: 100%;
max-width: 750px;
.channel-tab {
position: fixed;
top: 0;
left: 0;
z-index: 1;
width: 100%;
height: 90px;
font-size: 24px;
text-align: center;
background: #fff;
.channel {
display: inline-block;
line-height: 90px;
width: 33%;
color: #999;
&.focus {
color: #000;
}
}
.name {
padding: 9px 0;
&.focus {
border-bottom: 4px solid #000;
}
}
.focus {
.name {
border-bottom: 4px solid #000;
}
}
}
.resources {
background: #f6f6f6;
.title-image {
a {
display: block;
}
.image {
width: 100%;
height: 364px;
}
img {
width: 100%;
height: 100%;
}
}
.header-title {
position: relative;
width: 100%;
height: 100px;
font-size: 32px;
line-height: 100px;
text-align: center;
font-weight: bold;
border-top: 1px solid #eee;
margin: 0;
margin-top: 20px;
background: #fff;
.more {
position: absolute;
top: 0;
right: 0;
width: 100px;
height: 100px;
}
}
.focus {
.swipe {
height: 100%;
}
.swipe-1 {
.swipe-indicators {
display: none;
}
}
.swipe-item {
a {
display: block;
}
img {
width: 100%;
height: 100%;
}
}
.swipe-indicators {
left: initial;
right: 20px;
}
.swipe-indicator {
width: 8px;
height: 8px;
background: #ccc;
opacity: 1;
vertical-align: middle;
&.active {
width: 12px;
height: 12px;
background: #fff;
}
}
}
.focus-left-right {
padding: 30px 15px;
width: 100%;
overflow-x: auto;
white-space: nowrap;
font-size: 0;
background: #fff;
border-bottom: 1px solid #eee;
-webkit-overflow-scrolling: touch;
/* stylelint-disable */
&::-webkit-scrollbar {
display:none;
}
/* stylelint-enable */
a {
display: inline-block;
margin: 0 15px;
width: 250px;
height: 250px;
}
img {
width: 100%;
height: 100%;
}
}
.recommend-content-five {
width: 100%;
font-size: 0;
a {
display: inline-block;
width: 50%;
height: 375px;
}
img {
width: 100%;
height: 100%;
}
}
}
}
\ No newline at end of file
... ...