pond: More dark CSS

This commit is contained in:
Łukasz Magiera 2019-09-19 16:27:01 +02:00
parent 3ae0cc3388
commit 6d71929fcc
12 changed files with 48 additions and 36 deletions

View File

@ -105,7 +105,7 @@ class Address extends React.Component {
}
addr = <span className={`pondaddr-${this.props.addr}`}
onMouseEnter={() => sheet.sheet.insertRule(`.pondaddr-${this.props.addr}, .pondaddr-${this.props.addr} * { color: #11ee11; }`, 0)}
onMouseEnter={() => sheet.sheet.insertRule(`.pondaddr-${this.props.addr}, .pondaddr-${this.props.addr} * { color: #11ee11 !important; }`, 0)}
onMouseLeave={() => sheet.sheet.deleteRule(0)}
>{addr}</span>

View File

@ -80,7 +80,7 @@ a:visited {
}
a:hover {
color: #10a010;
color: #30a00a;
}
.Button {
@ -92,6 +92,10 @@ a:hover {
.Window {
background: #2a2a2a !important;
color: #e0e0e0;
}
.Window b {
color: #f0f0f0;
}
@ -103,6 +107,14 @@ a:hover {
background: #f0f0f0;
}
.Window a:link {
color: #30a015;
}
.Window a:visited {
color: #30a015;
}
/* POND */
.App {
@ -169,19 +181,20 @@ a:hover {
.ChainExplorer {
font-family: monospace;
color: #d0d0d0;
}
.ChainExplorer-at {
min-width: 40em;
background: #77ff77;
background: #222222;
}
.ChainExplorer-after {
background: #cc9c44
background: #440000
}
.ChainExplorer-before {
background: #cccc00
background: #444400
}
.Logs {

View File

@ -1,7 +1,7 @@
import React from 'react';
import {Cristal} from "react-cristal";
import {BlockLinks} from "./BlockLink";
import Address from "./Address";
import Window from "./Window";
class Block extends React.Component {
constructor(props) {
@ -57,9 +57,9 @@ class Block extends React.Component {
)
}
return (<Cristal className="CristalScroll" initialSize={{width: 700, height: 400}} onClose={this.props.onClose} title={`Block ${this.props.cid['/']}`}>
return (<Window className="CristalScroll" initialSize={{width: 700, height: 400}} onClose={this.props.onClose} title={`Block ${this.props.cid['/']}`}>
{content}
</Cristal>)
</Window>)
}
}

View File

@ -1,6 +1,6 @@
import React from 'react';
import {Cristal} from "react-cristal";
import {BlockLinks} from "./BlockLink";
import Window from "./Window";
const rows = 32
@ -132,9 +132,9 @@ class ChainExplorer extends React.Component {
return <div key={row} className={className}>@{row} {info}</div>
})}</div>
return (<Cristal onClose={this.props.onClose} title={`Chain Explorer ${this.state.follow ? '(Following)' : ''}`}>
return (<Window onClose={this.props.onClose} title={`Chain Explorer ${this.state.follow ? '(Following)' : ''}`}>
{content}
</Cristal>)
</Window>)
}
}

View File

@ -1,6 +1,6 @@
import React from 'react';
import Cristal from 'react-cristal'
import Address from "./Address";
import Window from "./Window";
const dealStates = [
"Unknown",
@ -94,12 +94,12 @@ class Client extends React.Component {
</div>)
return <Cristal title={"Client - Node " + this.props.node.ID} onClose={this.props.onClose}>
return <Window title={"Client - Node " + this.props.node.ID} onClose={this.props.onClose}>
<div className="Client">
<div>{dealMaker}</div>
<div>{deals}</div>
</div>
</Cristal>
</Window>
}
}

View File

@ -1,5 +1,5 @@
import React from 'react';
import Cristal from 'react-cristal'
import Window from "./Window";
async function awaitReducer(prev, c) {
return {...await prev, ...await c}
@ -107,7 +107,7 @@ class ConnMgr extends React.Component {
})
return(
<Cristal title={`Connection Manager${this.state.lock ? ' (syncing)' : ''}`}>
<Window title={`Connection Manager${this.state.lock ? ' (syncing)' : ''}`}>
<table>
<thead><tr><td></td>{keys.slice(0, -1).map((i) => (<td key={i}>{i}</td>))}</tr></thead>
<tbody>{rows}</tbody>
@ -118,7 +118,7 @@ class ConnMgr extends React.Component {
<button onClick={this.connect1}>Conn1</button>
<button onClick={this.connectChain}>ConnChain</button>
</div>
</Cristal>
</Window>
)
}
}

View File

@ -1,6 +1,6 @@
import React from 'react';
import {Cristal} from "react-cristal";
import {BlockLinks} from "./BlockLink";
import Window from "./Window";
function styleForHDiff(max, act) {
switch (max - act) {
@ -42,7 +42,7 @@ class Consensus extends React.Component {
}
render() {
return (<Cristal title={`Consensus`}>
return (<Window title={`Consensus`}>
<div className='Consensus'>
<div>Max Height: {this.state.maxH}</div>
<div>
@ -62,7 +62,7 @@ class Consensus extends React.Component {
</table>
</div>
</div>
</Cristal>)
</Window>)
}
}

View File

@ -1,9 +1,9 @@
import React from 'react'
import {Cristal} from "react-cristal";
import { Terminal } from 'xterm';
import { AttachAddon } from "xterm-addon-attach";
import 'xterm/dist/xterm.css';
import * as fit from 'xterm/lib/addons/fit/fit';
import Window from "./Window";
class Logs extends React.Component {
constructor(props) {
@ -22,9 +22,9 @@ class Logs extends React.Component {
}
render() {
return <Cristal className="Logs-window" onClose={this.props.onClose} initialSize={{width: 1000, height: 480}} title={`Node ${this.props.node} Logs`}>
return <Window className="Logs-window" onClose={this.props.onClose} initialSize={{width: 1000, height: 480}} title={`Node ${this.props.node} Logs`}>
<div ref={this.termRef} className="Logs"/>
</Cristal>
</Window>
}
}

View File

@ -2,12 +2,12 @@ import React from 'react';
import FullNode from "./FullNode";
import ConnMgr from "./ConnMgr";
import Consensus from "./Consensus";
import {Cristal} from "react-cristal";
import StorageNode from "./StorageNode";
import {Client} from "rpc-websockets";
import pushMessage from "./chain/send";
import Logs from "./Logs";
import StorageNodeInit from "./StorageNodeInit";
import Window from "./Window";
const [NodeUnknown, NodeRunning, NodeStopped] = [0, 1, 2]
@ -155,7 +155,7 @@ class NodeList extends React.Component {
}
return (
<Cristal title={"Node List"} initialPosition="bottom-left">
<Window title={"Node List"} initialPosition="bottom-left">
<div className={'NodeList'}>
<div>
<button onClick={this.spawnNode} disabled={!this.state.existingLoaded}>Spawn Node</button>
@ -190,7 +190,7 @@ class NodeList extends React.Component {
{connMgr}
{consensus}
</div>
</Cristal>
</Window>
);
}
}

View File

@ -1,5 +1,5 @@
import React from 'react'
import {Cristal} from "react-cristal";
import Window from "./Window";
class State extends React.Component {
constructor(props) {
@ -21,9 +21,9 @@ class State extends React.Component {
<div>{Object.keys(this.state.State).map(k => <div key={k}>{k}: <span>{JSON.stringify(this.state.State[k])}</span></div>)}</div>
</div>
return <Cristal onClose={this.props.onClose} title={`Actor ${this.props.addr} @{this.props.ts.Height}`}>
return <Window onClose={this.props.onClose} title={`Actor ${this.props.addr} @{this.props.ts.Height}`}>
{content}
</Cristal>
</Window>
}
}

View File

@ -1,7 +1,7 @@
import React from 'react';
import {Cristal} from "react-cristal";
import { Client } from 'rpc-websockets'
import Address from "./Address";
import Window from "./Window";
const stateConnected = 'connected'
const stateConnecting = 'connecting'
@ -121,7 +121,7 @@ class StorageNode extends React.Component {
)
}
return <Cristal
return <Window
title={"Storage Miner Node " + this.props.node.ID}
initialPosition={{x: this.props.node.ID*30, y: this.props.node.ID * 30}}
onClose={this.stop} >
@ -130,7 +130,7 @@ class StorageNode extends React.Component {
{runtime}
</div>
</div>
</Cristal>
</Window>
}
}

View File

@ -1,6 +1,5 @@
import React from 'react';
import {Cristal} from "react-cristal";
import StorageNode from "./StorageNode";
import Window from "./Window";
class StorageNodeInit extends React.Component {
async componentDidMount() {
@ -11,7 +10,7 @@ class StorageNodeInit extends React.Component {
}
render() {
return <Cristal
return <Window
title={"Storage miner initializing"}
initialPosition={'center'}>
<div className="CristalScroll">
@ -19,7 +18,7 @@ class StorageNodeInit extends React.Component {
Waiting for init, make sure at least one miner is enabled
</div>
</div>
</Cristal>
</Window>
}
}