From 9b13f23119516bf75028592a4813931333087dcc Mon Sep 17 00:00:00 2001 From: Victor Baranov Date: Fri, 2 Nov 2018 17:37:19 +0300 Subject: [PATCH] Trezor integration --- app/images/popout.svg | 22 +++- .../connect-hardware/account-list.js | 111 +++++++++--------- .../app/components/connect-hardware/index.js | 6 +- old-ui/app/css/hw.css | 72 ++++++++++-- 4 files changed, 137 insertions(+), 74 deletions(-) diff --git a/app/images/popout.svg b/app/images/popout.svg index 575651243..760fe4379 100644 --- a/app/images/popout.svg +++ b/app/images/popout.svg @@ -1 +1,21 @@ - \ No newline at end of file + + + + popout + Created with Sketch. + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/old-ui/app/components/connect-hardware/account-list.js b/old-ui/app/components/connect-hardware/account-list.js index c70809442..4501307f1 100644 --- a/old-ui/app/components/connect-hardware/account-list.js +++ b/old-ui/app/components/connect-hardware/account-list.js @@ -9,7 +9,7 @@ class AccountList extends Component { super(props) } - getHdPaths () { + getHdPaths = () => { return [ { label: `Ledger Live`, @@ -35,21 +35,21 @@ class AccountList extends Component { this.props.getPage(this.props.device, -1, this.props.selectedPath) } - renderHdPathSelector () { + renderHdPathSelector = () => { const { onPathChange, selectedPath } = this.props const options = this.getHdPaths() return (
-

this.context.t('selectHdPath')

-

this.context.t('selectPathHelp')

-
+

Select HD Path

+

{`If you don't see your existing Ledger accounts below, try switching paths to "Legacy (MEW / MyCrypto)"`}

+
this.props.onAccountChange(e.target.value)} checked={this.props.selectedAccount === a.index.toString()} /> -
- - + target="_blank" + title="View account on Etherscan" + > + +
) }) - + return ( -
{rows}
+
{rows}
) } - renderPagination () { + renderPagination = () => { return ( -
- - + >{`Next >`} +
) } - renderButtons () { + renderButtons = () => { const disabled = this.props.selectedAccount === null const buttonProps = {} if (disabled) { @@ -136,35 +136,35 @@ class AccountList extends Component { } return ( -
+
+ >Cancel + >Unlock
) } - renderForgetDevice () { + renderForgetDevice = () => { return ( -
- {this.context.t('forgetDevice')} +
+ Forget this device
) } - render () { + render = () => { return ( -
+
{this.renderHeader()} {this.renderAccounts()} {this.renderPagination()} @@ -176,7 +176,6 @@ class AccountList extends Component { } - AccountList.propTypes = { onPathChange: PropTypes.func.isRequired, selectedPath: PropTypes.string.isRequired, @@ -193,8 +192,4 @@ AccountList.propTypes = { onAccountRestriction: PropTypes.func, } -AccountList.contextTypes = { - t: PropTypes.func, -} - module.exports = AccountList diff --git a/old-ui/app/components/connect-hardware/index.js b/old-ui/app/components/connect-hardware/index.js index 58f7a06cc..c6837a408 100644 --- a/old-ui/app/components/connect-hardware/index.js +++ b/old-ui/app/components/connect-hardware/index.js @@ -4,7 +4,6 @@ import { connect } from 'react-redux' import actions from '../../../../ui/app/actions' import ConnectScreen from './connect-screen' import AccountList from './account-list' -import { DEFAULT_ROUTE } from '../../../../ui/app/routes' import { formatBalance } from '../../../../ui/app/util' import { getPlatform } from '../../../../app/scripts/lib/util' import { PLATFORM_FIREFOX } from '../../../../app/scripts/lib/enums' @@ -153,14 +152,14 @@ class ConnectHardwareForm extends Component { this.props.unlockHardwareWalletAccount(this.state.selectedAccount, device) .then(_ => { - this.props.history.push(DEFAULT_ROUTE) + this.props.goHome() }).catch(e => { this.setState({ error: e.toString() }) }) } onCancel = () => { - this.props.history.push(DEFAULT_ROUTE) + this.props.goHome() } renderError () { @@ -235,7 +234,6 @@ ConnectHardwareForm.propTypes = { goHome: PropTypes.func, numberOfExistingAccounts: PropTypes.number, history: PropTypes.object, - t: PropTypes.func, network: PropTypes.string, accounts: PropTypes.object, address: PropTypes.string, diff --git a/old-ui/app/css/hw.css b/old-ui/app/css/hw.css index 49f935edc..edb45c0f1 100644 --- a/old-ui/app/css/hw.css +++ b/old-ui/app/css/hw.css @@ -176,7 +176,7 @@ width: 100%; margin-bottom: 23px; align-self: flex-start; color: #5d5d5d; - font-family: Roboto; + font-family: Nunito Regular; font-size: 16px; line-height: 21px; font-weight: bold; @@ -187,7 +187,7 @@ width: 100%; margin-bottom: 23px; align-self: flex-end; color: #5d5d5d; - font-family: Roboto; + font-family: Nunito Regular; font-size: 16px; line-height: 21px; font-weight: normal; @@ -242,21 +242,71 @@ width: 100%; height: 15px; } .hw-list-pagination { -display: flex; -align-self: flex-end; -margin-top: 10px; + margin-top: 10px; } .hw-list-pagination__button { height: 19px; - display: flex; - color: #33a4e7; + float: right; + color: #6729a8; font-size: 14px; line-height: 19px; border: none; min-width: 46px; - margin-right: 0px; - margin-left: 16px; padding: 0px; - text-transform: uppercase; - font-family: Roboto; + font-family: Nunito Regular; + background: transparent; +} +.hw-forget-device-container { + display: flex; + flex-flow: column; + align-items: center; + padding: 22px; +} +.hw-forget-device-container a { + color: #60db97; + font-size: 14px; + cursor: pointer; +} +.new-account-connect-form { + /*display: flex;*/ + flex-flow: column; + align-items: center; + /*padding: 15px 30px 0;*/ + height: 710px; + /*overflow: auto;*/ +} +.new-account-connect-form.unsupported-browser { + height: 210px; +} +.new-account-connect-form.account-list { + height: auto; + padding-left: 20px; + padding-right: 20px; +} +.new-account-connect-form__buttons { + margin-top: 39px; + display: flex; + width: 100%; + justify-content: space-between; +} +.new-account-connect-form__button { + width: 150px; + min-width: initial; +} +.new-account-connect-form .btn-primary { + background-color: #259DE5; + color: #FFFFFF; + border: none; + width: 100%; + min-height: 54px; + font-weight: 300; + font-size: 14px; + margin-bottom: 20px; +} +.new-account-connect-form__button.unlock { + width: 50%; +} +.new-account-connect-form__button.btn-primary--disabled { + cursor: not-allowed; + opacity: .5; } \ No newline at end of file