1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-28 03:08:30 +00:00

Refactored send confirm dialog

This commit is contained in:
Vladimir Volek 2018-08-31 21:23:29 +02:00
parent 37d7f06aed
commit fc659db337

View File

@ -1,14 +1,16 @@
/* @flow */ import styled from 'styled-components';
import React, { Component } from 'react'; import H3 from 'components/Heading';
import colors from 'config/colors';
import { findAccount } from 'reducers/AccountsReducer'; import P from 'components/Paragraph';
import { FONT_SIZE } from 'config/variables';
import React from 'react';
const Wrapper = styled.div` const Wrapper = styled.div`
width: 370px; width: 390px;
padding: 24px 48px;
`; `;
const Header = styled.div` const Header = styled.div`
padding: 24px 48px;
`; `;
const Content = styled.div` const Content = styled.div`
@ -18,11 +20,11 @@ const Content = styled.div`
`; `;
const Label = styled.div` const Label = styled.div`
font-size: 10px; font-size: ${FONT_SIZE.SMALLER};
color: ${colors.TEXT_SECONDARY}; color: ${colors.TEXT_SECONDARY};
`; `;
const ConfirmAddress = (props: Props) => { const ConfirmAddress = (props) => {
const { const {
account, account,
network, network,
@ -30,16 +32,16 @@ const ConfirmAddress = (props: Props) => {
if (!account || !network) return null; if (!account || !network) return null;
return ( return (
<div className="confirm-address"> <Wrapper>
<div className="header"> <Header>
<h3>Confirm address on TREZOR</h3> <H3>Confirm address on TREZOR</H3>
<p>Please compare your address on device with address shown bellow.</p> <P>Please compare your address on device with address shown bellow.</P>
</div> </Header>
<div className="content"> <Content>
<p>{ account.address }</p> <P>{ account.address }</P>
<label>{ network.symbol } account #{ (account.index + 1) }</label> <Label>{ network.symbol } account #{ (account.index + 1) }</Label>
</div> </Content>
</div> </Wrapper>
); );
}; };