arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-28 03:08:30 +00:00
Code Issues Releases Wiki Activity

Footer rewrited and used react prop types instead of flow

Browse Source
This commit is contained in:
Vladimir Volek 2018-08-10 16:44:36 +02:00
parent d8995cbb49
commit 1ab5e9c8ab
3 changed files with 35 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/js/components/common/Footer.js
View File

@ -1,31 +1,45 @@
/* @flow */ import styled from 'styled-components';
import PropTypes from 'prop-types';
import React from 'react'; import React from 'react';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import colors from '~/js/config/colors';
import * as LogActions from '~/js/actions/LogActions'; import * as LogActions from '~/js/actions/LogActions';
import type { State, Dispatch } from '~/flowtype';
type Props = { const Wrapper = styled.div`
toggle: typeof LogActions.toggle width: 100%;
} font-size: 12px;
color: ${colors.TEXT_SECONDARY};
padding: 22px 48px;
border-top: 1px solid ${colors.DIVIDER};
display: flex;
`;
const Footer = (props: Props): React$Element<string> => ( const A = styled.a`
<footer> margin: 0px 6px;
<span>© 2018</span> margin-right: 20px;
<a href="http://satoshilabs.com" target="_blank" rel="noreferrer noopener" className="satoshi green">SatoshiLabs</a> `;
<a href="tos.pdf" target="_blank" rel="noreferrer noopener" className="green">Terms</a>
<a onClick={props.toggle} className="green">Show Log</a> const Copy = styled.div`
</footer> margin-right: 20px;
`;
const Footer = ({ toggle }) => (
<Wrapper>
<Copy>© 2018</Copy>
<A href="http://satoshilabs.com" target="_blank" rel="noreferrer noopener" className="satoshi green">SatoshiLabs</A>
<A href="tos.pdf" target="_blank" rel="noreferrer noopener" className="green">Terms</A>
<A onClick={toggle} className="green">Show Log</A>
</Wrapper>
); );
export default connect( Footer.propTypes = {
(state: State) => ({ toggle: PropTypes.func.isRequired,
};
}), const mapDispatchToProps = dispatch => ({
(dispatch: Dispatch) => ({
toggle: bindActionCreators(LogActions.toggle, dispatch), toggle: bindActionCreators(LogActions.toggle, dispatch),
}), });
)(Footer);
export default connect(null, mapDispatchToProps)(Footer);

22
src/styles/footer.less
View File

@ -1,22 +0,0 @@
footer {
width: 100%;
font-size: 12px;
color: @color_text_secondary;
padding: 22px 48px;
border-top: 1px solid @color_divider;
display: flex;
span, a {
white-space: nowrap;
}
span {
margin-right: 10px;
}
a {
margin: 0px 6px;
font-weight: 500;
margin-right: 20px;
}
}

1
src/styles/index.less
View File

@ -5,7 +5,6 @@
@import './header.less'; @import './header.less';
@import './aside.less'; @import './aside.less';
@import './content.less'; @import './content.less';
@import './footer.less';
@import './modal.less'; @import './modal.less';
@import './reactSelect.less'; @import './reactSelect.less';