m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

Fix button styling for Create Account Connect (#5787)

Browse Source
This commit is contained in:
Alexander Tseung 2018-11-19 22:46:41 -08:00 committed by Dan Finlay
parent 4c87c05a02
commit a7b3750a3e
3 changed files with 13 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/app/components/pages/create-account/connect-hardware/account-list.js
View File

@ -152,7 +152,7 @@ class AccountList extends Component {
}, [this.context.t('cancel')]),
h(Button, {
type: 'primary',
type: 'confirm',
large: true,
className: 'new-account-connect-form__button unlock',
disabled,

16
ui/app/components/pages/create-account/connect-hardware/connect-screen.js
View File

@ -45,11 +45,13 @@ class ConnectScreen extends Component {
this.renderConnectToLedgerButton(),
this.renderConnectToTrezorButton(),
]),
h(
`button.hw-connect__connect-btn${!this.state.selectedDevice ? '.disabled' : ''}`,
{ onClick: this.connect },
this.context.t('connect')
),
h(Button, {
type: 'confirm',
large: true,
className: 'hw-connect__connect-btn',
onClick: this.connect,
disabled: !this.state.selectedDevice,
}, this.context.t('connect')),
])
)
}
@ -67,9 +69,7 @@ class ConnectScreen extends Component {
onClick: () => global.platform.openWindow({
url: 'https://google.com/chrome',
}),
},
this.context.t('downloadGoogleChrome')
),
}, this.context.t('downloadGoogleChrome')),
])
)
}

42
ui/app/css/itcss/components/new-account.scss
View File

@ -3,6 +3,7 @@
background-color: #FFFFFF;
box-shadow: 0 0 7px 0 rgba(0,0,0,0.08);
z-index: 25;
height: 100%;
&__header {
display: flex;
@ -186,22 +187,8 @@
}
&__connect-btn {
background-color: #259De5;
color: #fff;
border: none;
width: 315px;
min-height: 54px;
font-weight: 300;
font-size: 14px;
margin-bottom: 20px;
margin-top: 20px;
border-radius: 5px;
display: flex;
flex: 1;
margin-left: 20px;
margin-right: 20px;
justify-content: center;
text-transform: uppercase;
margin: 20px;
}
&__connect-btn.disabled {
@ -489,29 +476,8 @@
justify-content: space-between;
}
&__button {
width: 150px;
min-width: initial;
}
.btn-primary {
background-color: #259DE5;
color: #FFFFFF;
border: none;
width: 100%;
min-height: 54px;
font-weight: 300;
font-size: 14px;
margin-bottom: 20px
}
&__button.unlock {
width: 50%;
}
&__button.btn-primary--disabled {
cursor: not-allowed;
opacity: .5;
&__button:not(:last-child) {
margin-right: 16px;
}
}