Merge pull request #305 from trezor/fix/dashboard-icons
Moved icons to shared folder, added correct icons to dashboard
@ -34,7 +34,7 @@ class CoinLogo extends PureComponent {
|
|||||||
<Logo
|
<Logo
|
||||||
className={className}
|
className={className}
|
||||||
hasLongIcon={this.hasLongIcon(network)}
|
hasLongIcon={this.hasLongIcon(network)}
|
||||||
src={require(`./images/${network}.png`)} // eslint-disable-line
|
src={require(`images/coins/${network}.png`)} // eslint-disable-line
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
Before Width: | Height: | Size: 5.6 KiB After Width: | Height: | Size: 5.6 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
Before Width: | Height: | Size: 6.9 KiB After Width: | Height: | Size: 6.9 KiB |
Before Width: | Height: | Size: 4.6 KiB After Width: | Height: | Size: 4.6 KiB |
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 7.3 KiB |
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 5.9 KiB |
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 14 KiB |
@ -3,9 +3,11 @@ import styled from 'styled-components';
|
|||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import Content from 'views/Wallet/components/Content';
|
import Content from 'views/Wallet/components/Content';
|
||||||
|
|
||||||
|
import EthIcon from 'images/coins/eth.png';
|
||||||
|
import RippleIcon from 'images/coins/xrp.png';
|
||||||
|
|
||||||
import { H1 } from 'components/Heading';
|
import { H1 } from 'components/Heading';
|
||||||
import Paragraph from 'components/Paragraph';
|
import Paragraph from 'components/Paragraph';
|
||||||
import DashboardImg from 'images/dashboard.png';
|
|
||||||
|
|
||||||
const Wrapper = styled.div`
|
const Wrapper = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -26,13 +28,34 @@ const StyledP = styled(Paragraph)`
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
const Overlay = styled.div`
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
opacity: 0.2;
|
||||||
|
background: white;
|
||||||
|
`;
|
||||||
|
|
||||||
|
const Image = styled.img`
|
||||||
|
margin-right: 10px;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
const Dashboard = () => (
|
const Dashboard = () => (
|
||||||
<Content>
|
<Content>
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
<Row>
|
<Row>
|
||||||
<H1>Please select your coin</H1>
|
<H1>Please select your coin</H1>
|
||||||
<StyledP>You will gain access to receiving & sending selected coin</StyledP>
|
<StyledP>You will gain access to receiving & sending selected coin</StyledP>
|
||||||
<img src={DashboardImg} height="34" width="auto" alt="Dashboard" />
|
<Overlay>
|
||||||
|
<Image src={EthIcon} width={20} />
|
||||||
|
<Image src={RippleIcon} width={25} />
|
||||||
|
</Overlay>
|
||||||
</Row>
|
</Row>
|
||||||
</Wrapper>
|
</Wrapper>
|
||||||
</Content>
|
</Content>
|
||||||
|