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) => { @@ -6,7 +6,7 @@ const detail = (req, res, next) => {
6 co(function* () { 6 co(function* () {
7 return res.render('guang/detail', { 7 return res.render('guang/detail', {
8 css: yield css('guang/detail.css'), 8 css: yield css('guang/detail.css'),
9 - msg: 'xxxxxxx' 9 + width750: true
10 }); 10 });
11 })().catch(next); 11 })().catch(next);
12 }; 12 };
@@ -6,7 +6,7 @@ const logger = global.yoho.logger; @@ -6,7 +6,7 @@ const logger = global.yoho.logger;
6 const css = {}; 6 const css = {};
7 7
8 module.exports = (file) => { 8 module.exports = (file) => {
9 - const isDev = process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'test'; 9 + const isDev = process.env.NODE_ENV !== 'production' || process.env.NODE_ENV !== 'test';
10 10
11 if (css[file] && !isDev) { 11 if (css[file] && !isDev) {
12 return Promise.resolve(css[file]); 12 return Promise.resolve(css[file]);
1 -body {  
2 - display: flex;  
3 -  
4 - a {  
5 - display: none;  
6 - } 1 +.guang-detail-c {
  2 + width: 100%;
  3 + overflow: hidden;
  4 + padding-bottom: 30px;
  5 +}
  6 +.guang-detail-c .editor-info {
  7 + width: 100%;
  8 + height: 65px;
  9 + border-bottom: 1px solid #e0e0e0;
  10 + padding: 0 20px;
  11 +}
  12 +.editor-info .pic {
  13 + padding-top: 10px;
  14 + width: 45px;
  15 + height: 45px;
  16 + float: left;
  17 +}
  18 +.editor-info .name {
  19 + line-height: 65px;
  20 + float: left;
  21 + font-size: 14px;
  22 + color: #000;
  23 + padding-left: 20px;
  24 +}
  25 +.editor-info .intro {
  26 + line-height: 65px;
  27 + float: left;
  28 + font-size: 14px;
  29 + color: #b0b0b0;
  30 + padding-left: 20px;
  31 +}
  32 +.article-info {
  33 + padding: 10px 20px;
  34 +}
  35 +.article-info .name {
  36 + line-height: 30px;
  37 + font-size: 20px;
  38 + color: #000;
  39 + font-weight: bold;
  40 +}
  41 +.article-info .view-c {
  42 + color: #b0b0b0;
  43 + font-size: 12px;
  44 + line-height: 30px;
  45 +}
  46 +.guang-content {
  47 + padding: 0 20px 20px;
  48 +}
  49 +.guang-content p {
  50 + padding: 5px 0;
  51 +}
  52 +.guang-content img {
  53 + width: 100%;
  54 +}
  55 +.related-goods {
  56 + padding: 0 20px;
  57 + float: left;
  58 +}
  59 +.related-goods .good-item {
  60 + border-top: 1px solid #e0e0e0;
  61 + float: left;
  62 + padding: 20px 0;
  63 +}
  64 +.related-goods .good-item .pic{
  65 + width: 25%;
  66 + float: left;
7 } 67 }
  68 +.related-goods .good-item .info{
  69 + width: 70%;
  70 + float: left;
  71 + margin-left: 5%;
  72 +}
  73 +.related-goods .good-item .name{
  74 + color: #000;
  75 + padding: 10px 0;
  76 + font-size: 14px;
  77 + display: -webkit-box;
  78 + -webkit-line-clamp: 3;
  79 + overflow: hidden;
  80 + text-overflow: ellipsis;
  81 + -webkit-box-orient: vertical;
  82 + line-height: 25px;
  83 +}
  84 +.related-goods .good-item .price{
  85 + color: #d62927;
  86 + font-size: 14px;
  87 +}
  88 +.more-goods {
  89 + height: 40px;
  90 + line-height: 40px;
  91 + clear: both;
  92 + border-top: 1px solid #e0e0e0;
  93 + border-bottom: 1px solid #e0e0e0;
  94 + font-size: 16px;
  95 + margin: 0 20px;
  96 +}
  97 +.recommend-goods {
  98 + width: 100%;
  99 + height: 133px;
  100 + overflow-x: scroll;
  101 + overflow-y: hidden;
  102 +}
  103 +.good-scroll {
  104 + height: 133px;
  105 + width: 20000px;
  106 +}
  107 +.recommend-goods .good-item {
  108 + float: left;
  109 + position: relative;
  110 + width: 100px;
  111 +}
  112 +.recommend-goods .good-item .price{
  113 + width: 100px;
  114 + height: 20px;
  115 + color: #fff;
  116 + text-align: center;
  117 + line-height: 20px;
  118 + position: absolute;
  119 + bottom: 0;
  120 + left: 0;
  121 + background-color: #000;
  122 + opacity: 0.7;
  123 +}
  124 +
  125 +
  126 +
  127 +
  128 +
1 -{{msg}} 1 +<div class="guang-detail-c">
  2 + <div class="editor-info">
  3 + <mip-img class="pic" src="http://img13.static.yhbimg.com/author/2016/04/26/11/025bce88d3e2f071cfed867cd0cc1322ce.jpg">
  4 + </mip-img>
  5 + <div class="name">章三</div>
  6 + <div class="intro">kuchuadad1</div>
  7 + </div>
  8 + <div class="article-info">
  9 + <p class="name">测试一下新版逛资讯</p>
  10 + <div class="view-c">
  11 + <span class="iconfont">&#xe603;5月8日 10:11</span>
  12 + <span class="iconfont">&#xe603;9999</span>
  13 + </div>
  14 + </div>
  15 + <div class="guang-content">
  16 + <p>阿三开的花镂空的卡 u 还是离开</p>
  17 + <mip-img src="//img11.static.yhbimg.com/goodsimg/2017/05/08/10/01c1a22365138c958321d7adca2a399124.png">
  18 + </mip-img>
  19 + <p>阿三开的花镂空的卡 u 还是离开</p>
  20 + </mip-img>
  21 + </div>
  22 + <div class="related-goods clearfix">
  23 + <div class="good-item">
  24 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  25 + </mip-img>
  26 + <div class="info">
  27 + <p class="name">damao-基础店铺商品18</p>
  28 + <p class="price">¥500</p>
  29 + </div>
  30 + </div>
  31 + <div class="good-item">
  32 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  33 + </mip-img>
  34 + <div class="info">
  35 + <p class="name">damao-基础店铺商品18</p>
  36 + <p class="price">¥500</p>
  37 + </div>
  38 + </div>
  39 + <div class="good-item">
  40 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  41 + </mip-img>
  42 + <div class="info">
  43 + <p class="name">damao-基础店铺商品18</p>
  44 + <p class="price">¥500</p>
  45 + </div>
  46 + </div>
  47 + </div>
  48 + <div class="more-goods">更多商品</div>
  49 + <div class="recommend-goods">
  50 + <div class="good-scroll">
  51 + <div class="good-item">
  52 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  53 + </mip-img>
  54 + <p class="price">¥500</p>
  55 + </div>
  56 + <div class="good-item">
  57 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  58 + </mip-img>
  59 + <p class="price">¥500</p>
  60 + </div>
  61 + <div class="good-item">
  62 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  63 + </mip-img>
  64 + <p class="price">¥500</p>
  65 + </div>
  66 + <div class="good-item">
  67 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  68 + </mip-img>
  69 + <p class="price">¥500</p>
  70 + </div>
  71 + <div class="good-item">
  72 + <mip-img class="pic" src="http://img10.static.yhbimg.com/goodsimg/2015/11/10/15/01ca0eef0fa9c4f8f8f6e40ef8f6e34344.jpg">
  73 + </mip-img>
  74 + <p class="price">¥500</p>
  75 + </div>
  76 + </div>
  77 + </div>
  78 +</div>
  79 +
  80 +
  81 +
  82 +
  83 +
  84 +
  85 +
  86 +
  87 +
  88 +
  89 +
  90 +
  91 +