added labels to market table dexlab-io#6

aesthytik · Nov 14, 2018 · 0e3429d · 0e3429d
1 parent 1a44868
commit 0e3429d
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/src/assets/css/style.less b/src/assets/css/style.less
@@ -14,7 +14,7 @@ header .account .msg { position: absolute; bottom: -2px; right: -2px; display: b
 header .account .msg i { display: inline-block; transform: scale(0.6, 0.6); vertical-align: top; }
 
 /*---------------------
-    custom 
+    custom
 -----------------------*/
 .side { position: absolute; height: 100%; top: 66px; right: -1.5px; width: 33%; padding-left: 5px;}
 .sideOrderBook {position: absolute; height: 44%; left:0; width: 32%; border-radius:5px; }
@@ -167,14 +167,14 @@ header .account .msg i { display: inline-block; transform: scale(0.6, 0.6); vert
 .token-select .icon-star, .token-select .token-select-header h2 { font-size: 18px; }
 .token-select .token-select-body { padding: 20px 0; max-height: 655px; overflow: auto; }
 .token-select .token-select-body .item { font-size: 13px; }
-.token-select .token-select-body .item li { display: flex; justify-content: flex-start; align-items: center; padding: 0 30px; line-height: 40px; }
+.token-select .token-select-body .item li { display: flex; justify-content: flex-start; align-items: center; padding: 0 15px; line-height: 40px; }
 .token-select .token-select-body .item li.active, .token-select .token-select-body .item li.active:hover { background: @blue-dark; }
 .token-select .token-select-body .item li.active { color: @text-color-dark }
 .token-select .token-select-body .item li:hover { background: @light-color-2; }
 .token-select .token-select-body .item li>span:nth-child(1) { display: block; width: 30px; }
 .token-select .token-select-body .item li>span:nth-child(2) { display: block; width: 110px; }
 .token-select .token-select-body .item li>span:nth-child(3) { display: block; width: 160px; }
-.token-select .token-select-body .item li>span:nth-child(4) { display: block; width: 85px; }
+.token-select .token-select-body .item li>span:nth-child(4) { display: block; width: 120px; }
 .token-select .token-select-body .item li>span:nth-child(5) { display: block; width: 120px; }
 .token-select .token-select-body .title { height: 20px; color: #000000; padding: 0 30px; font-weight: 600; line-height: 20px; }
 .token-select .token-select-body .item li span i { font-size: 12px; color: @text-color-2 }

diff --git a/src/components/tickers/ListAllTickers.js b/src/components/tickers/ListAllTickers.js
@@ -86,19 +86,27 @@ function ListAllTickers(props) {
 	                  recentTickers.length >0 && !keywords &&
                     <div className="item">
                         <div className="title">{intl.get('ticker_list.title_recent')}</div>
-                        <ul>{recentTickers.map((item,index)=><TickItem item={item} actions={actions} />)}</ul>
+                        <ul>
+                        {recentTickers.map((item,index)=><TickItem item={item} actions={actions} />)}
+                        </ul>
                     </div>
                   }
                   {
                     favoredTickers.length >0 &&
                     <div className="item">
                         <div className="title">{intl.get('ticker_list.title_favorites')}</div>
-                        <ul>{favoredTickers.map((item,index)=><TickItem item={item} actions={actions} />)}</ul>
+                        <ul>
+
+                        {favoredTickers.map((item,index)=><TickItem item={item} actions={actions} />)}
+                        </ul>
                     </div>
                   }
 	                <div className="item">
 	                    <div className="title">{intl.get('common.all')} {intl.get('common.markets')}</div>
-	                    <ul>{allTickers.map((item,index)=><TickItem key={index} item={item} actions={actions} />)}</ul>
+                      <ul>
+                      <li><span></span><span></span><span style={{fontWeight: 600}}>{intl.get('ticker.last')}</span><span style={{fontWeight: 600}}>{intl.get('ticker.change')}</span><span style={{fontWeight: 600}}>{intl.get('ticker.vol')}</span></li>
+                      {allTickers.map((item,index)=><TickItem key={index} item={item} actions={actions} />)}
+                      </ul>
 	                </div>
 	            </div>
 	        </div>