Some styling

This commit is contained in:
maciejhirsz
2018-07-02 16:55:55 +02:00
parent 0330e0dfae
commit 7ea9c8f7fc
4 changed files with 15 additions and 8 deletions
+6
View File
@@ -6,6 +6,12 @@
<meta name="theme-color" content="#000000"> <meta name="theme-color" content="#000000">
<!-- <link rel="manifest" href="%PUBLIC_URL%/manifest.json"> --> <!-- <link rel="manifest" href="%PUBLIC_URL%/manifest.json"> -->
<title>Polkadot Telemetry</title> <title>Polkadot Telemetry</title>
<style>
body, html {
background: #fefefe;
color: #111;
}
</style>
</head> </head>
<body> <body>
<noscript> <noscript>
-2
View File
@@ -1,7 +1,5 @@
.App { .App {
text-align: center; text-align: center;
background: #fff;
color: #000;
font-family: monospace, sans-serif; font-family: monospace, sans-serif;
} }
+7 -5
View File
@@ -7,11 +7,12 @@ import { State } from './state';
import { formatNumber } from './utils'; import { formatNumber } from './utils';
import './App.css'; import './App.css';
import nodeIcon from './icons/broadcast.svg'; import nodeIcon from './icons/server.svg';
import nodeTypeIcon from './icons/terminal.svg'; import nodeTypeIcon from './icons/terminal.svg';
import peersIcon from './icons/organization.svg'; import peersIcon from './icons/broadcast.svg';
import transactionsIcon from './icons/inbox.svg'; import transactionsIcon from './icons/inbox.svg';
import blockIcon from './icons/package.svg'; import blockIcon from './icons/package.svg';
import blockHashIcon from './icons/file-binary.svg';
import blockTimeIcon from './icons/history.svg'; import blockTimeIcon from './icons/history.svg';
export default class App extends React.Component<{}, State> { export default class App extends React.Component<{}, State> {
@@ -35,11 +36,12 @@ export default class App extends React.Component<{}, State> {
<table className="App-list"> <table className="App-list">
<thead> <thead>
<tr> <tr>
<th><Icon src={nodeIcon} alt="Node Name" /></th> <th><Icon src={nodeIcon} alt="Node" /></th>
<th><Icon src={nodeTypeIcon} alt="Node Type" /></th> <th><Icon src={nodeTypeIcon} alt="Implementation" /></th>
<th><Icon src={peersIcon} alt="Peer Count" /></th> <th><Icon src={peersIcon} alt="Peer Count" /></th>
<th><Icon src={transactionsIcon} alt="Transactions in Queue" /></th> <th><Icon src={transactionsIcon} alt="Transactions in Queue" /></th>
<th><Icon src={blockIcon} alt="Best Block" /></th> <th><Icon src={blockIcon} alt="Block" /></th>
<th><Icon src={blockHashIcon} alt="Block Hash" /></th>
<th><Icon src={blockTimeIcon} alt="Block Time" /></th> <th><Icon src={blockTimeIcon} alt="Block Time" /></th>
</tr> </tr>
</thead> </thead>
+2 -1
View File
@@ -22,7 +22,8 @@ export function Node(props: Node.Props) {
<td>{implementation} v{version}</td> <td>{implementation} v{version}</td>
<td>{peers}</td> <td>{peers}</td>
<td>{txcount}</td> <td>{txcount}</td>
<td>#{formatNumber(height)} / <span title={hash}>{trimHash(hash, 16)}</span></td> <td>#{formatNumber(height)}</td>
<td><span title={hash}>{trimHash(hash, 16)}</span></td>
<td>{blockTime / 1000}s</td> <td>{blockTime / 1000}s</td>
</tr> </tr>
); );