forks/go-ethereum
1
0
Fork 1
mirror of https://github.com/ethereum/go-ethereum.git synced 2026-08-19 10:22:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Block explorer Accounts page

Browse source
This commit is contained in:
Chris Fenos 2018-08-18 19:02:49 -04:00
parent f2e8c4ec08
commit 1fc10ba082
8 changed files with 64 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
shyftBlockExplorerUI/src/components/table/accounts/accountRows.js
View file

@ -45,14 +45,14 @@ class AccountTable extends Component {
let combinedClasses = ['responsive-table', classes.table]; let combinedClasses = ['responsive-table', classes.table];
return ( return (
<table className={combinedClasses.join(' ')}> <table className={combinedClasses.join(' ')}>
<thead className={classes.tHead}> <thead>
<tr> <tr>
<th scope="col">Rank</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Rank</th>
<th scope="col">Address</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Address</th>
<th scope="col">Balance</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Balance</th>
<th scope="col">Percentage</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Percentage</th>
<th scope="col">TxCount</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxCount</th>
</tr> </tr>
</thead> </thead>
{table} {table}
</table> </table>

23
shyftBlockExplorerUI/src/components/table/accounts/accounts.css
View file

@ -1,21 +1,24 @@
.table { .table {
border-spacing: 100rem; border-spacing: 100rem;
width: 100%; width: 95%;
margin-top: 50px; margin: 0 auto;
} background-color: white;
top: 107pt;
.tHead { left: 2.5%;
font-size: 1rem; position: absolute;
} }
th { th {
background-color: aliceblue; background-color: white;
padding-right: 10px; padding: 15pt 30pt ;
color: #593c83;
font-family: 'Open Sans', sans-serif;
} }
td { td {
padding-left: 5px; font-size: 6pt;
font-size: .5rem; background-color: white;
font-family: 'Open Sans', sans-serif;
} }
.addressTag { .addressTag {

16
shyftBlockExplorerUI/src/components/table/accounts/accountsTable.js
View file

@ -4,17 +4,17 @@ import { Link } from 'react-router-dom'
const AccountsTable = (props) => { const AccountsTable = (props) => {
return ( return (
<tbody> <tbody>
<tr> <tr style={{ borderTop: '1px solid #e0defb' }}>
<td>{props.Rank}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Rank}</td>
<td className={classes.addressTag}><Link to="/account/detail" onClick={() => props.detailAccountHandler(props.Addr)}> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}><Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.Addr)}>
{props.Addr} {props.Addr}
</Link></td> </Link></td>
<td>{props.Balance}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Balance}</td>
<td>{props.Percentage}%</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Percentage}%</td>
<td>{props.AccountNonce}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.AccountNonce}</td>
</tr> </tr>
</tbody> </tbody>
) )
}; };

7
shyftBlockExplorerUI/src/components/table/blocks/table.css
View file

@ -8,13 +8,6 @@
position: absolute; position: absolute;
} }
thead {
font-size: 7pt;
background-color: white;
font-family: 'Open Sans', sans-serif;
color: #593c83;
}
th { th {
background-color: white; background-color: white;
padding: 15pt 30pt ; padding: 15pt 30pt ;

4
shyftBlockExplorerUI/src/components/table/transactions/table.css
View file

@ -8,12 +8,12 @@
position: absolute; position: absolute;
} }
.tHead { /* .tHead {
font-size: 7pt; font-size: 7pt;
background-color: white; background-color: white;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
color: #593c83; color: #593c83;
} } */
th { th {
background-color: white; background-color: white;

20
shyftBlockExplorerUI/src/components/table/transactions/transactionRow.js
View file

@ -44,16 +44,16 @@ class TransactionTable extends Component {
return ( return (
<table key={this.state.data.TxHash} className={combinedClasses.join(' ')}> <table key={this.state.data.TxHash} className={combinedClasses.join(' ')}>
<thead> <thead>
<tr> <tr>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxHash</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxHash</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Block</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Block</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Age</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Age</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>From</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>From</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}></th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}></th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>To</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>To</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Value</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Value</th>
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >TxFee</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >TxFee</th>
</tr> </tr>
</thead> </thead>
{table} {table}
</table> </table>

4
shyftBlockExplorerUI/src/components/table/transactions/transactionTable.js
View file

@ -12,7 +12,7 @@ const TransactionTable = (props) => {
} }
return ( return (
<tbody> <tbody>
<tr style={{ borderTop: '1px solid #e0defb' }}> <tr style={{ borderTop: '1px solid #e0defb' }}>
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}>
<Link to="/transaction/details" style={{ color: '#8f67c9' }} className={flag ? "" : classes.disabled} onClick={() => props.detailTransactionHandler(props.txHash)}> <Link to="/transaction/details" style={{ color: '#8f67c9' }} className={flag ? "" : classes.disabled} onClick={() => props.detailTransactionHandler(props.txHash)}>
@ -26,7 +26,7 @@ const TransactionTable = (props) => {
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.value}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.value}</td>
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.cost}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.cost}</td>
</tr> </tr>
</tbody> </tbody>
) )
} }

45
shyftBlockExplorerUI/src/containers/App.js
View file

@ -11,7 +11,6 @@ import Home from '../components/home/home';
///**TRANSACTIONS**/// ///**TRANSACTIONS**///
import TransactionRow from '../components/table/transactions/transactionRow'; import TransactionRow from '../components/table/transactions/transactionRow';
import TransactionHeader from "../components/nav/transactionHeader/transactionHeader";
import TransactionDetailHeader from "../components/nav/transactionHeader/transactionDetailHeader"; import TransactionDetailHeader from "../components/nav/transactionHeader/transactionDetailHeader";
import DetailTransactionTable from "../components/table/transactions/transactionDetailsRow"; import DetailTransactionTable from "../components/table/transactions/transactionDetailsRow";
import BlockTxs from "../components/table/transactions/blockTx"; import BlockTxs from "../components/table/transactions/blockTx";
@ -20,13 +19,12 @@ import BlockTxs from "../components/table/transactions/blockTx";
import BlocksRow from '../components/table/blocks/blockRows'; import BlocksRow from '../components/table/blocks/blockRows';
import DetailBlockTable from '../components/table/blocks/blocksDetailsRow'; import DetailBlockTable from '../components/table/blocks/blocksDetailsRow';
import BlockDetailHeader from "../components/nav/blockHeaders/blockDetailHeader"; import BlockDetailHeader from "../components/nav/blockHeaders/blockDetailHeader";
import BlockHeader from "../components/nav/blockHeaders/blockHeader";
import BlocksMinedTable from "../components/table/blocks/blocksMined"; import BlocksMinedTable from "../components/table/blocks/blocksMined";
import BlockCoinbaseHeader from "../components/nav/blockHeaders/blockCoinbaseHeader"; import BlockCoinbaseHeader from "../components/nav/blockHeaders/blockCoinbaseHeader";
///**ACCOUNTS**/// ///**ACCOUNTS**///
import AccountsRow from '../components/table/accounts/accountRows'; import AccountsRow from '../components/table/accounts/accountRows';
import DetailAccountsTable from "../components/table/accounts/detailAccountsRow"; import DetailAccountsTable from "../components/table/accounts/detailAccountsRow";
import AccountHeader from "../components/nav/accountHeaders/accountHeader";
import AccountDetailHeader from "../components/nav/accountHeaders/accountDetailHeader"; import AccountDetailHeader from "../components/nav/accountHeaders/accountDetailHeader";
import classes from './App.css'; import classes from './App.css';
@ -101,36 +99,35 @@ class App extends Component {
<Nav /> <Nav />
<Route path="/" exact render={({ match }) => <Route path="/" exact render={({ match }) =>
<Home/>} <Home/>
}
/> />
<Route path="/transactions" render={({match}) => <Route path="/transactions" render={({match}) =>
<div> <div>
{/* <TransactionHeader /> */} <TransactionRow
<TransactionRow getBlockTransactions={this.getBlockTransactions}
getBlockTransactions={this.getBlockTransactions} detailTransactionHandler={this.detailTransactionHandler}
detailTransactionHandler={this.detailTransactionHandler} detailAccountHandler={this.detailAccountHandler}/>
detailAccountHandler={this.detailAccountHandler}/> </div>
</div>} }
/> />
<Route path="/blocks" exact render={({match}) => <Route path="/blocks" exact render={({match}) =>
<div> <div>
{/* <BlockHeader/> */} <BlocksRow
getBlocksMined={this.getBlocksMined}
<BlocksRow getBlockTransactions={this.getBlockTransactions}
getBlocksMined={this.getBlocksMined} detailBlockHandler={this.detailBlockHandler}/>
getBlockTransactions={this.getBlockTransactions} </div>
detailBlockHandler={this.detailBlockHandler}/> }
</div>}
/> />
<Route path="/accounts" exact render={({match}) => <Route path="/accounts" exact render={({match}) =>
<div> <div>
<AccountHeader/> <AccountsRow detailAccountHandler={this.detailAccountHandler}/>
<AccountsRow detailAccountHandler={this.detailAccountHandler}/> </div>
</div>} }
/> />
<Route path="/transaction/details" exact render={({match}) => <Route path="/transaction/details" exact render={({match}) =>