From 40e3a6a179314db438d164edb3575511a9773be2 Mon Sep 17 00:00:00 2001
From: Chris Fenos <chris.m.fenos@gmail.com>
Date: Sat, 18 Aug 2018 12:52:48 -0400
Subject: [PATCH] Block explorer UI redesgin. Initial Template built for blocks
 section.

---
 .../src/components/nav/nav.css                | 13 +----------
 .../src/components/table/blocks/blockTable.js | 22 +++++++++----------
 .../src/components/table/blocks/table.css     | 11 ++++------
 shyftBlockExplorerUI/src/containers/App.js    |  3 +++
 4 files changed, 19 insertions(+), 30 deletions(-)

diff --git a/shyftBlockExplorerUI/src/components/nav/nav.css b/shyftBlockExplorerUI/src/components/nav/nav.css
index 039a15fd7c..ee9d9141d8 100644
--- a/shyftBlockExplorerUI/src/components/nav/nav.css
+++ b/shyftBlockExplorerUI/src/components/nav/nav.css
@@ -1,5 +1,5 @@
 .navHeader {
-    height: 25vh;
+    height: 27.5vh;
     background-color: #4f2e7e;
     padding-top: 30pt;
     padding-left: 2.5%;
@@ -13,7 +13,6 @@
     font-family: 'Open Sans', sans-serif;
     font-size: 15px;
     text-transform: uppercase;
-
 }
 
 .buttonContainer {
@@ -38,14 +37,4 @@
     color: #4f2e7e;
     background-color: #ffffff;
     font-size: 8px;
-   
-
 }
-/* 
-button:active{
-    background-color: white;
-}
-
-button:focus {
-    background-color: white;
-} */
diff --git a/shyftBlockExplorerUI/src/components/table/blocks/blockTable.js b/shyftBlockExplorerUI/src/components/table/blocks/blockTable.js
index 729985833f..04555a10e0 100644
--- a/shyftBlockExplorerUI/src/components/table/blocks/blockTable.js
+++ b/shyftBlockExplorerUI/src/components/table/blocks/blockTable.js
@@ -5,19 +5,19 @@ import { Link } from 'react-router-dom'
 const BlockTable = (props) => {
     return (
           <tbody>
-            <tr>
-                <td style={{paddingLeft: '30pt' }} ><Link to="/blocks/detail" onClick={() => props.detailBlockHandler(props.Number)}>
+            <tr style={{ borderTop: '1px solid #e0defb' }}>
+                <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }} ><Link to="/blocks/detail" style={{ color: '#8f67c9' }} onClick={() => props.detailBlockHandler(props.Number)}>
                     {props.Number}
                 </Link></td>
-                <td style={{paddingLeft: '30pt' }} className={classes.addressTag}>{props.Hash}</td>
-                <td style={{paddingLeft: '30pt' }}>{props.AgeGet}</td>
-                <td style={{paddingLeft: '30pt' }}>{props.TxCount}</td>
-                <td style={{paddingLeft: '30pt' }}>{props.UncleCount}</td>
-                <td style={{paddingLeft: '30pt' }} className={classes.addressTag}><Link to="/mined/blocks" onClick={() => props.getBlocksMined(props.Coinbase)}>{props.Coinbase}</Link></td>
-                <td style={{paddingLeft: '30pt' }}>{props.GasUsed}</td>
-                <td style={{paddingLeft: '30pt' }}>{props.GasLimit}</td>
-                <td style={{paddingLeft: '30pt' }}>TBD</td>
-                <td style={{paddingLeft: '30pt' }}>{props.Reward}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'   }} className={classes.addressTag}>{props.Hash}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'   }}>{props.AgeGet}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }}>{props.TxCount}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'   }}>{props.UncleCount}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }} className={classes.addressTag}><Link to="/mined/blocks" style={{ color: '#8f67c9' }} onClick={() => props.getBlocksMined(props.Coinbase)}>{props.Coinbase}</Link></td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }}>{props.GasUsed}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }}>{props.GasLimit}</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'   }}>TBD</td>
+                <td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'  }}>{props.Reward}</td>
             </tr>
             </tbody>
     )
diff --git a/shyftBlockExplorerUI/src/components/table/blocks/table.css b/shyftBlockExplorerUI/src/components/table/blocks/table.css
index 94bb2c4d6a..1492932065 100644
--- a/shyftBlockExplorerUI/src/components/table/blocks/table.css
+++ b/shyftBlockExplorerUI/src/components/table/blocks/table.css
@@ -2,8 +2,10 @@
     border-spacing: 100rem;
     width: 95%;
     margin: 0 auto;  
-    margin-top: -4%;
     background-color: white;
+    top: 20vh;
+    left: 2.5%;
+    position: fixed;
 }
 
 thead {
@@ -11,13 +13,11 @@ thead {
     background-color: white;
     font-family: 'Open Sans', sans-serif;
     color: #593c83;
-    
 }
 
 th {
     background-color: white;
-    padding-right: 10px;
-    padding: 25pt 30pt ;
+    padding: 15pt 30pt ;
     color: #593c83;
     font-family: 'Open Sans', sans-serif;
 }
@@ -26,9 +26,6 @@ td {
     font-size: 6pt;
     background-color: white;
     font-family: 'Open Sans', sans-serif;
-
-    /* padding: 25px;
-    margin-left: 25px; */
 }
 
 .addressTag {
diff --git a/shyftBlockExplorerUI/src/containers/App.js b/shyftBlockExplorerUI/src/containers/App.js
index 6d7b30e440..bd6fdb15ed 100644
--- a/shyftBlockExplorerUI/src/containers/App.js
+++ b/shyftBlockExplorerUI/src/containers/App.js
@@ -99,7 +99,10 @@ class App extends Component {
         <BrowserRouter>
     
             <div style={{backgroundColor:"#f7f8f9", paddingBottom:"5%" }}>
+
+            {/* <div className={"row"}> */}
                 <Nav />
+            {/* </div> */}
              
             <Route path="/" exact render={({ match }) =>
                 <Home/>}