fe / yoho-blk · Commits

Go to a project

Authored by biao
Commit 427f9121060af74a7116e9a3837277036ceacb10 1 parent d35e632e

update for channel

Inline Side-by-side
Showing 13 changed files with 282 additions and 73 deletions
... ... @@ -25,7 +25,7 @@ const pkg = require('./package.json');
const yohoLib = require('yoho-node-lib');
const app = express();
const MemcachedStore = memcached(session);
// const MemcachedStore = memcached(session);
// 全局注册library
yohoLib.global(config);
... ... @@ -53,22 +53,22 @@ app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(cookieParser());
app.use(session({
proxy: true,
resave: false,
saveUninitialized: true,
unset: 'destroy',
secret: '82dd7e724f2c6870472c89dfa43cf48d',
name: 'yohoblk-session',
cookie: {
domain: 'yohoblk.com',
httpOnly: false
},
store: new MemcachedStore({
hosts: config.memcache.session,
prefix: 'yohoblk_session:'
})
}));
// app.use(session({
// proxy: true,
// resave: false,
// saveUninitialized: true,
// unset: 'destroy',
// secret: '82dd7e724f2c6870472c89dfa43cf48d',
// name: 'yohoblk-session',
// cookie: {
// domain: 'yohoblk.com',
// httpOnly: false
// },
// store: new MemcachedStore({
// hosts: config.memcache.session,
// prefix: 'yohoblk_session:'
// })
// }));
app.use((req, res, next) => {
req.user = {}; // 全局的用户数据
... ...
... ... @@ -35,8 +35,27 @@ const getContent = () => {
newArrivals: [
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: '',
link: ''
name: 'STUSSY',
link: '/',
smallImg: true
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'DAILY PAPER',
link: '/',
even: true
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'BAPE',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'SUPREME',
link: '/',
even: true,
smallImg: true
},
]
},
... ... @@ -66,9 +85,31 @@ const getContent = () => {
styleIcon: [
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: '',
des: '',
link: ''
name: 'COTE&CIEL',
des: '这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'COTE&CIEL',
des: '这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'COTE&CIEL',
des: '这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
name: 'COTE&CIEL',
des: '这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生这都什么时代了？短发女生',
link: '/ ',
btnText: '去看看'
}
]
},
... ...
... ... @@ -3,13 +3,18 @@
{{#if slider}}
{{> slider}}
{{/if}}
<div class="resources-container">
{{/ content}}
<div class="main-container">
{{# content}}
{{#if brandsAd}}
{{> ad}}
{{/if}}
{{#if newArrivals}}
{{> new-arrival}}
{{/if}}
</div>
{{/ content}}
{{#if styleIcon}}
{{> style-icon}}
{{/if}}
{{/ content}}
</div>
</div>
... ...
<div class="floor-header">
<h4 class="en-title">{{floorEn}}</h4>
<h4 class="zh-title">{{floorZh}}</h4>
</div>
... ...
<div class="new-arrival"></div>
<div class="new-arrival">
{{> floor-header}}
<div class="arrival-item-box">
{{# newArrivals}}
<div class="arrival-item {{#if smallImg}}small-img{{/if}} {{#if @last}}last{{^}}normal{{/if}}">
{{#if even}}
<img src="{{image img 245 370}}" alt="">
<div class="brand-name">
<span class="bottom">{{name}}</span>
</div>
{{^}}
<div class="brand-name">
<span class="top">{{name}}</span>
</div>
<img src="{{image img 245 370}}" alt="">
{{/if}}
</div>
{{/ newArrivals}}
</div>
</div>
... ...
<div class="style-icon-container">
{{> floor-header}}
<div class="smooth-card-container">
{{# styleIcon}}
<div class="card {{#if @first}}active{{/if}}">
<div class="img" style="background-image: url('{{image img 160 240}}')"></div>
{{> brand-text-box}}
</div>
{{/ styleIcon}}
</div>
</div>
... ...
require('../plugins/slider');
$('.slide-container').slider();
$('.card').mouseenter(function() {
var $this = $(this);
if($this.hasClass('active')) {
return false;
}
$('.active').removeClass('active');
$this.addClass('active');
});
... ...
.ad-container {
width: 860px;
height: 225px;
margin: 0 auto;
box-sizing: border-box;
border: 1px solid #ccc;
border: 1PX solid $grayBorder;
background-color: #fff;
.ad {
... ... @@ -15,7 +14,7 @@
}
.ad.first {
border-right: 1px solid #ccc;
border-right: 1PX solid $grayBorder;
}
img {
... ...
$size: 14px;
$line-height: 1.8;
$lines-to-show: 3;
.brand-text-box {
$size: 14px;
$line-height: 1.8;
$lines-to-show: 3;
display: inline-block;
float: left;
height: 100%;
... ... @@ -36,7 +36,7 @@ $lines-to-show: 3;
bottom: 29px;
background-color: white;
outline: none;
border: 1px solid black;
border: 1PX solid black;
font-size: 12px;
}
}
... ...
... ... @@ -474,48 +474,22 @@
}
.floor-header {
position: relative;
margin: 80px 0 40px;
.floor-title {
margin: 0 auto;
width: 298px;
height: 31px;
line-height: 31px;
border: 1px solid #000;
font-size: 16px;
text-align: center;
}
text-align: center;
height: 60px;
line-height: 1.4;
font-weight: bold;
font-size: 16px;
.header-navs {
position: absolute;
padding: 10px 0;
top: 0;
right: 0;
.zh-title {
font-size: 14px;
li {
float: left;
padding: 1px 15px;
border-left: 1px solid #ccc;
&:first-child {
border-left: none;
}
&:hover {
text-decoration: underline;
}
a {
color: #333;
}
}
}
}
.resources-container {
.main-container {
position: relative;
top: 390px;
width: 864px;
margin: 0 auto;
box-sizing: border-box;
}
}
... ...
$grayBorder: #f0f0f0;
.resource-container {
margin-top: 60px;
}
@import "home";
@import "ad";
@import "brand-text-box";
@import "new-arrival";
@import "style-icon";
... ...
.new-arrival {
width: 1100px;
height: 500px;
border: 1px solid #ccc;
$textHeight: 35px;
$imgHeight: 370px;
@extend .resource-container;
height: calc($textHeight+$imgHeight+60px);/* 60px is the height of the floor header*/
.arrival-item-box {
box-sizing: border-box;
.arrival-item {
width: 245px;
display: inline-block;
.brand-name {
height: $textHeight;
text-align: center;
font-size: 12px;
span {
padding-bottom: 3px;
border-bottom: 1px solid #000;
&.top {
line-height: 20px;
}
&.bottom {
line-height: 40px;
}
}
}
img {
width: 100%;
height: $imgHeight;
}
&.normal {
float: left;
margin-right: 17px;
}
&.last {
float: right;
}
&.small-img {
width: 160px;
}
}
}
}
... ...
.style-icon-container {
$width: 160px;
$height: 240px;
$space: 15px;
@extend .resource-container;
clear: both;
.smooth-card-container {
margin: 0 auto;
}
.card {
height: $height;
display: inline-block;
float: left;
position: relative;
box-sizing: border-box;
.img {
width: $width;
height: 100%;
display: inline-block;
float: left;
margin-right: $space;
background-size: 100% 100%;
background-position: center center;
}
.brand-text-box {
$size: 12px;
$line-height: 1.2;
$lines-to-show: 3;
width: 0;
border: none;
p {
height: calc($size*$line-height*$lines-to-show);
width: calc($width-2*$space);
padding-right: $space;
font-size: $size;
line-height: $line-height;
overflow: hidden;
-webkit-line-clamp: $lines-to-show;
-webkit-box-orient: vertical;
color: #505050;
}
button {
left: calc($width/2-105px/2);
}
* {
display: none;
}
}
&.active {
width: calc($width*2+$space);
.img {
margin-right: 0;
}
.brand-text-box {
width: $width;
height: 100%;
display: inline-block;
float: left;
padding: 25px 0 25px $space;
border: 1px solid #ccc;
border-left: none;
* {
display: block;
}
p {
display: -webkit-box;
}
}
}
}
}
... ...