97 lines
2.8 KiB
JavaScript
97 lines
2.8 KiB
JavaScript
import React from 'react';
|
|
import styles from './style.js';
|
|
import EthereumLogo from './../assets/ethereum-logo.svg';
|
|
import MetamaskLogo from './../assets/metamask-logo.svg';
|
|
|
|
function capitalize(string) {
|
|
return string.charAt(0).toUpperCase() + string.slice(1);
|
|
}
|
|
|
|
const NoConnection = ({ network }) => console.log(network) || (
|
|
<div style={styles.NoEthereumSection}>
|
|
<img style={styles.ImgHeaderLogo} alt="Status" src="images/logo.png" />
|
|
<hr />
|
|
<img
|
|
style={styles.ImgEthereumLogo}
|
|
alt="Ethereum"
|
|
src={EthereumLogo}
|
|
/>
|
|
<h2>NOT CONNECTED TO ETHEREUM {network.toUpperCase()}</h2>
|
|
<p style={styles.PNotFound}>
|
|
This application requires an Ethereum client to be running and connected to {capitalize(network)}. A client
|
|
could not be detected which probably means it's not
|
|
installed, running or is misconfigured.
|
|
</p>
|
|
<p style={styles.PUseClients}>
|
|
Please use one of the following clients to connect to Ethereum:
|
|
</p>
|
|
<div style={styles.DivClients}>
|
|
<div style={styles.DivSubClients}>
|
|
<img style={styles.ImgLogo} alt="Metamask" src={MetamaskLogo} />
|
|
<h2>METAMASK</h2>
|
|
<p>
|
|
<span style={styles.AlignNumber}>
|
|
<span style={styles.NumberCircle}>1</span>
|
|
</span>Install
|
|
<a
|
|
href="https://metamask.io/"
|
|
rel="noopener noreferrer"
|
|
target="_blank"
|
|
>
|
|
{" "}
|
|
Metamask
|
|
</a>
|
|
</p>
|
|
<p>
|
|
<span style={styles.AlignNumber}>
|
|
<span style={styles.NumberCircle}>2</span>
|
|
</span>Use Chrome to browse
|
|
<a
|
|
rel="noopener noreferrer"
|
|
href="https://vote.status.im"
|
|
target="_blank"
|
|
>
|
|
{" "}
|
|
https://vote.status.im
|
|
</a>
|
|
</p>
|
|
</div>
|
|
<div style={styles.DivSubClients}>
|
|
<img style={styles.ImgLogo} alt="Mist" src="images/mist.png" />
|
|
<h2>MIST</h2>
|
|
<p>
|
|
<span style={styles.AlignNumber}>
|
|
<span style={styles.NumberCircle}>1</span>
|
|
</span>Install and run
|
|
<a
|
|
rel="noopener noreferrer"
|
|
href="https://github.com/ethereum/mist/releases"
|
|
target="_blank"
|
|
>
|
|
{" "}
|
|
Mist
|
|
</a>
|
|
</p>
|
|
<p>
|
|
<span style={styles.AlignNumber}>
|
|
<span style={styles.NumberCircle}>2</span>
|
|
</span>
|
|
Use Mist to browse
|
|
<a
|
|
rel="noopener noreferrer"
|
|
href="https://vote.status.im"
|
|
target="_blank"
|
|
>
|
|
{" "}
|
|
https://vote.status.im
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
NoConnection.displayName = 'NoConnection';
|
|
|
|
export default NoConnection;
|