fe / yohobuywap-node · Commits

Go to a project

Authored by 李靖
Commit 9b6177483f34fc4f50fd56e5c1c1c5980c18004f 1 parent e4101bfc

暂存

Inline Side-by-side
Showing 4 changed files with 220 additions and 9 deletions
... ... @@ -6,7 +6,7 @@ const detail = (req, res, next) => {
co(function* () {
return res.render('guang/detail', {
css: yield css('guang/detail.css'),
msg: 'xxxxxxx'
width750: true
});
})().catch(next);
};
... ...
... ... @@ -6,7 +6,7 @@ const logger = global.yoho.logger;
const css = {};
module.exports = (file) => {
const isDev = process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'test';
const isDev = process.env.NODE_ENV !== 'production' || process.env.NODE_ENV !== 'test';
if (css[file] && !isDev) {
return Promise.resolve(css[file]);
... ...
body {
display: flex;
a {
display: none;
}
.guang-detail-c {
width: 100%;
overflow: hidden;
padding-bottom: 30px;
}
.guang-detail-c .editor-info {
width: 100%;
height: 65px;
border-bottom: 1px solid #e0e0e0;
padding: 0 20px;
}
.editor-info .pic {
padding-top: 10px;
width: 45px;
height: 45px;
float: left;
}
.editor-info .name {
line-height: 65px;
float: left;
font-size: 14px;
color: #000;
padding-left: 20px;
}
.editor-info .intro {
line-height: 65px;
float: left;
font-size: 14px;
color: #b0b0b0;
padding-left: 20px;
}
.article-info {
padding: 10px 20px;
}
.article-info .name {
line-height: 30px;
font-size: 20px;
color: #000;
font-weight: bold;
}
.article-info .view-c {
color: #b0b0b0;
font-size: 12px;
line-height: 30px;
}
.guang-content {
padding: 0 20px 20px;
}
.guang-content p {
padding: 5px 0;
}
.guang-content img {
width: 100%;
}
.related-goods {
padding: 0 20px;
float: left;
}
.related-goods .good-item {
border-top: 1px solid #e0e0e0;
float: left;
padding: 20px 0;
}
.related-goods .good-item .pic{
width: 25%;
float: left;
}
.related-goods .good-item .info{
width: 70%;
float: left;
margin-left: 5%;
}
.related-goods .good-item .name{
color: #000;
padding: 10px 0;
font-size: 14px;
display: -webkit-box;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
line-height: 25px;
}
.related-goods .good-item .price{
color: #d62927;
font-size: 14px;
}
.more-goods {
height: 40px;
line-height: 40px;
clear: both;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
font-size: 16px;
margin: 0 20px;
}
.recommend-goods {
width: 100%;
height: 133px;
overflow-x: scroll;
overflow-y: hidden;
}
.good-scroll {
height: 133px;
width: 20000px;
}
.recommend-goods .good-item {
float: left;
position: relative;
width: 100px;
}
.recommend-goods .good-item .price{
width: 100px;
height: 20px;
color: #fff;
text-align: center;
line-height: 20px;
position: absolute;
bottom: 0;
left: 0;
background-color: #000;
opacity: 0.7;
}
... ...
{{msg}}
<div class="guang-detail-c">
<div class="editor-info">
<mip-img class="pic" src="http://img13.static.yhbimg.com/author/2016/04/26/11/025bce88d3e2f071cfed867cd0cc1322ce.jpg">
</mip-img>
<div class="name">章三</div>
<div class="intro">kuchuadad1</div>
</div>
<div class="article-info">
<p class="name">测试一下新版逛资讯</p>
<div class="view-c">
<span class="iconfont">&#xe603;5月8日 10:11</span>
<span class="iconfont">&#xe603;9999</span>
</div>
</div>
<div class="guang-content">
<p>阿三开的花镂空的卡 u 还是离开</p>
<mip-img src="//img11.static.yhbimg.com/goodsimg/2017/05/08/10/01c1a22365138c958321d7adca2a399124.png">
</mip-img>
<p>阿三开的花镂空的卡 u 还是离开</p>
</mip-img>
</div>
<div class="related-goods clearfix">
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<div class="info">
<p class="name">damao-基础店铺商品18</p>
<p class="price">¥500</p>
</div>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<div class="info">
<p class="name">damao-基础店铺商品18</p>
<p class="price">¥500</p>
</div>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<div class="info">
<p class="name">damao-基础店铺商品18</p>
<p class="price">¥500</p>
</div>
</div>
</div>
<div class="more-goods">更多商品</div>
<div class="recommend-goods">
<div class="good-scroll">
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<p class="price">¥500</p>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<p class="price">¥500</p>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<p class="price">¥500</p>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<p class="price">¥500</p>
</div>
<div class="good-item">
<mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
</mip-img>
<p class="price">¥500</p>
</div>
</div>
</div>
</div>
... ...