fe / yohobuywap-node · Commits

Go to a project

Authored by 陈轩
Commit cf33cf0611c21e9c499334049606ebdf26a69b91 2 parents c42a364d a1da6306

Merge remote-tracking branch 'origin/feature/live' into feature/live

Inline Side-by-side
Showing 3 changed files with 63 additions and 71 deletions
@@ -61,7 +61,8 @@ const _getBestList = () => { @@ -61,7 +61,8 @@ const _getBestList = () => {
61 item.now_living = true; 61 item.now_living = true;
62 break; 62 break;
63 case 2: 63 case 2:
64 - item.rec_living = true; 64 + //直播结束不显示
  65 + result.data = [];
65 break; 66 break;
66 } 67 }
67 68
@@ -16,8 +16,10 @@ @@ -16,8 +16,10 @@
16 {{/content}} 16 {{/content}}
17 17
18 {{#if content}} 18 {{#if content}}
  19 + {{#if best}}
19 <div class="head_margin"></div> 20 <div class="head_margin"></div>
20 {{/if}} 21 {{/if}}
  22 + {{/if}}
21 23
22 {{! 精选房间}} 24 {{! 精选房间}}
23 {{#if best}} 25 {{#if best}}
@@ -35,7 +37,10 @@ @@ -35,7 +37,10 @@
35 <div class="liverec_info"> 37 <div class="liverec_info">
36 <img class="liverec_head" src="{{image master_pic 120 120}}" alt="头像"> 38 <img class="liverec_head" src="{{image master_pic 120 120}}" alt="头像">
37 <div class="liverec_pannel"> 39 <div class="liverec_pannel">
38 - <p class="liverec_name">{{master_name}} <span class="name-tag">{{master_meta}}</span></p> 40 + <p class="liverec_name">
  41 + <span class="name-name">{{master_name}}</span>
  42 + <span class="name-tag">{{master_meta}}</span>
  43 + </p>
39 <p class="liverec_tag">{{title}}</p> 44 <p class="liverec_tag">{{title}}</p>
40 </div> 45 </div>
41 </div> 46 </div>
@@ -46,9 +51,11 @@ @@ -46,9 +51,11 @@
46 {{/if}} 51 {{/if}}
47 52
48 {{! 直播中房间}} 53 {{! 直播中房间}}
  54 + {{#if living}}
  55 + <h2 class="living_title">直播中</h2>
  56 + {{/if}}
49 {{#living}} 57 {{#living}}
50 <div class="liveliving"> 58 <div class="liveliving">
51 - <h2 class="title">直播中</h2>  
52 <header> 59 <header>
53 <img class="main-head" src="{{image master_pic 120 120}}" alt="头像"> 60 <img class="main-head" src="{{image master_pic 120 120}}" alt="头像">
54 <div class="header-info"> 61 <div class="header-info">
@@ -93,9 +100,11 @@ @@ -93,9 +100,11 @@
93 {{/if}} 100 {{/if}}
94 101
95 {{! 精彩回看}} 102 {{! 精彩回看}}
  103 + {{#if record}}
  104 + <h2 class="living_title">精彩回看</h2>
  105 + {{/if}}
96 {{#record}} 106 {{#record}}
97 <div class="liveliving"> 107 <div class="liveliving">
98 - <h2 class="title">精彩回看</h2>  
99 <header> 108 <header>
100 <img class="main-head" src="{{image master_pic 120 120}}" alt="头像"> 109 <img class="main-head" src="{{image master_pic 120 120}}" alt="头像">
101 <div class="header-info"> 110 <div class="header-info">
@@ -10,6 +10,7 @@ $border: #e0e0e0; @@ -10,6 +10,7 @@ $border: #e0e0e0;
10 width: 100%; 10 width: 100%;
11 border-bottom: 1px solid $border; 11 border-bottom: 1px solid $border;
12 } 12 }
  13 +
13 .liverec { 14 .liverec {
14 height: 423px; 15 height: 423px;
15 width: 640px; 16 width: 640px;
@@ -56,61 +57,14 @@ $border: #e0e0e0; @@ -56,61 +57,14 @@ $border: #e0e0e0;
56 text-align: center; 57 text-align: center;
57 line-height: 1.5; 58 line-height: 1.5;
58 } 59 }
59 -  
60 - /*&_info {  
61 - position: relative;  
62 - height: 102px;  
63 - width: 320px;  
64 - border-top: 1px solid $border;  
65 - border-bottom: 1px solid $border;  
66 - }*/  
67 -  
68 - /*&_head {  
69 - position: absolute;  
70 - top: 20px;  
71 - left: 30px;  
72 - height: 60px;  
73 - width: 60px;  
74 - border-radius: 50%;  
75 - }*/  
76 -  
77 - /*&_pannel {  
78 - position: absolute;  
79 - top: 20px;  
80 - left: 110px;  
81 - }*/  
82 -  
83 - &_name {  
84 - margin-bottom: 14px;  
85 - font-size: 26px;  
86 - color: $black;  
87 - line-height: 100%;  
88 - }  
89 -  
90 - /*.name-tag {  
91 - position: relative;  
92 - top: -2px;  
93 - display: inline-block;  
94 - height: 26px;  
95 - width: 86px;  
96 - font-size: 17.9px;  
97 - background: $black;  
98 - margin-left: 5px;  
99 - border-radius: 20px;  
100 - color: $white;  
101 - text-align: center;  
102 - line-height: 1.5;  
103 - }*/  
104 - 60 +
105 &_tag { 61 &_tag {
106 font-size: 20px; 62 font-size: 20px;
  63 + line-height: 1.2;
107 color: $black; 64 color: $black;
108 - line-height: 100%;  
109 - display: -webkit-box;  
110 overflow: hidden; 65 overflow: hidden;
111 - word-break: break-all;  
112 - -webkit-box-orient: vertical;  
113 - -webkit-line-clamp: 1; 66 + white-space: nowrap;
  67 + text-overflow: ellipsis;
114 } 68 }
115 } 69 }
116 70
@@ -128,39 +82,56 @@ $border: #e0e0e0; @@ -128,39 +82,56 @@ $border: #e0e0e0;
128 } 82 }
129 83
130 .liverec_pannel { 84 .liverec_pannel {
  85 + line-height: 1;
131 overflow: hidden; 86 overflow: hidden;
132 } 87 }
133 88
134 .liverec_name { 89 .liverec_name {
135 - line-height: 1;  
136 font-size: 26px; 90 font-size: 26px;
137 margin-bottom: 14px; 91 margin-bottom: 14px;
  92 + color: $black;
  93 + line-height: 1.2;
  94 +
  95 + .name-name {
  96 + display: inline-block;
  97 + height: 26px;
  98 + max-width: 85px;
  99 + overflow: hidden;
  100 + }
138 101
139 .name-tag { 102 .name-tag {
140 display: inline-block; 103 display: inline-block;
141 - width: 100px;  
142 - text-align: center;  
143 font-size: 18px; 104 font-size: 18px;
  105 + height: 26px;
  106 + line-height: 26px;
  107 + padding: 0 8px;
  108 + max-width: 90px;
  109 + text-align: center;
  110 + background: $black;
  111 + border-radius: 20px;
  112 + color: $white;
  113 + vertical-align: top;
144 } 114 }
145 } 115 }
146 116
147 -.liveliving {  
148 - .title {  
149 - width: 640px;  
150 - height: 80px;  
151 - text-align: center;  
152 - line-height: 80px;  
153 - color: $black;  
154 - background: $titlebg;  
155 - font-size: 32px;  
156 - } 117 +.living_title {
  118 + width: 640px;
  119 + height: 80px;
  120 + text-align: center;
  121 + line-height: 80px;
  122 + color: $black;
  123 + background: $titlebg;
  124 + font-size: 32px;
  125 +}
157 126
  127 +.liveliving {
158 header { 128 header {
159 position: relative; 129 position: relative;
160 height: 102px; 130 height: 102px;
161 width: 640px; 131 width: 640px;
162 border-top: 1px solid $border; 132 border-top: 1px solid $border;
163 border-bottom: 1px solid $border; 133 border-bottom: 1px solid $border;
  134 + overflow: hidden;
164 } 135 }
165 136
166 .main-head { 137 .main-head {
@@ -176,18 +147,25 @@ $border: #e0e0e0; @@ -176,18 +147,25 @@ $border: #e0e0e0;
176 position: absolute; 147 position: absolute;
177 top: 20px; 148 top: 20px;
178 left: 110px; 149 left: 110px;
  150 + right: 0;
179 151
180 .main-name { 152 .main-name {
181 font-size: 26px; 153 font-size: 26px;
182 color: $black; 154 color: $black;
183 margin-bottom: 14px; 155 margin-bottom: 14px;
184 - line-height: 26px; 156 + line-height: 1.2;
  157 + overflow: hidden;
  158 + white-space: nowrap;
  159 + text-overflow: ellipsis;
185 } 160 }
186 161
187 .main-tag { 162 .main-tag {
188 font-size: 20px; 163 font-size: 20px;
189 color: $gray; 164 color: $gray;
190 - line-height: 20px; 165 + line-height: 1.2;
  166 + overflow: hidden;
  167 + white-space: nowrap;
  168 + text-overflow: ellipsis;
191 } 169 }
192 } 170 }
193 171
@@ -337,12 +315,13 @@ $border: #e0e0e0; @@ -337,12 +315,13 @@ $border: #e0e0e0;
337 position: absolute; 315 position: absolute;
338 top: 77px; 316 top: 77px;
339 left: 220px; 317 left: 220px;
  318 + right: 0;
340 } 319 }
341 320
342 .pre-title { 321 .pre-title {
343 font-size: 28px; 322 font-size: 28px;
344 color: $black; 323 color: $black;
345 - line-height: 100%; 324 + line-height: 1.2;
346 margin-bottom: 12px; 325 margin-bottom: 12px;
347 display: -webkit-box; 326 display: -webkit-box;
348 overflow: hidden; 327 overflow: hidden;
@@ -355,6 +334,9 @@ $border: #e0e0e0; @@ -355,6 +334,9 @@ $border: #e0e0e0;
355 font-size: 22px; 334 font-size: 22px;
356 color: $gray; 335 color: $gray;
357 line-height: 100%; 336 line-height: 100%;
  337 + overflow: hidden;
  338 + white-space: nowrap;
  339 + text-overflow: ellipsis;
358 } 340 }
359 } 341 }
360 } 342 }