1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-29 02:18:06 +00:00

Sign and verify migrated to styled components

This commit is contained in:
Vladimir Volek 2018-08-10 16:01:12 +02:00
parent a591c5ea8f
commit b7e5dba3d0
4 changed files with 62 additions and 60 deletions

View File

@ -1,29 +1,66 @@
import React from 'react';
import styled from 'styled-components';
import { H2 } from '~/js/components/common/Heading';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import colors from '~/js/config/colors';
const Wrapper = styled.div`
display: flex;
flex: 1;
flex-direction: row;
background: ${colors.WHITE};
padding: 50px;
`;
const StyledH2 = styled(H2)`
padding-bottom: 10px;
`;
const Column = styled.div`
display: flex;
flex: 1;
flex-direction: column;
`;
const Sign = styled(Column)``;
const Verify = styled(Column)`
padding-left: 20px;
`;
const Label = styled.div`
color: ${colors.LABEL};
padding: 5px 0px;
`;
const Textarea = styled.textarea`
resize: vertical;
width: 100%;
`;
const Input = styled.input``;
const SignVerify = () => (
<section className="signverify">
<div className="sign">
<H2>Sign message</H2>
<label>Message</label>
<textarea rows="4" maxLength="255" />
<label>Address</label>
<input type="text" />
<label>Signature</label>
<textarea rows="4" maxLength="255" readOnly="readonly" />
</div>
<div className="verify">
<H2>Verify message</H2>
<label>Message</label>
<textarea rows="4" maxLength="255" />
<label>Address</label>
<input type="text" />
<label>Signature</label>
<textarea rows="4" maxLength="255" />
</div>
</section>
<Wrapper>
<Sign>
<StyledH2>Sign message</StyledH2>
<Label>Message</Label>
<Textarea rows="4" maxLength="255" />
<Label>Address</Label>
<Input type="text" />
<Label>Signature</Label>
<Textarea rows="4" maxLength="255" readOnly="readonly" />
</Sign>
<Verify>
<StyledH2>Verify message</StyledH2>
<Label>Message</Label>
<Textarea rows="4" maxLength="255" />
<Label>Address</Label>
<Input type="text" />
<Label>Signature</Label>
<Textarea rows="4" maxLength="255" />
</Verify>
</Wrapper>
);
export default connect(null, null)(SignVerify);
export default SignVerify;

View File

@ -27,4 +27,6 @@ export default {
ERROR_PRIMARY: '#ED1212',
ERROR_SECONDARY: '#FFE9E9',
LABEL_COLOR: '#A9A9A9',
};

View File

@ -16,7 +16,6 @@
@import './send.less';
@import './receive.less';
@import './summary.less';
@import './signverify.less';
@import './deviceSettings.less';
@import './landingPage.less';

View File

@ -1,36 +0,0 @@
.signverify {
flex: 1;
display: flex;
flex-direction: row;
background: @color_white;
h2 {
line-height: 74px;
}
.sign,
.verify {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 50px;
textarea {
resize: vertical;
width: 100%;
}
// textarea[readonly] {
// background: #A9A9A9;
// }
}
label {
color: #A9A9A9;
padding: 5px 0px;
}
.verify {
padding-right: 20px;
}
}