mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-22 17:33:23 +01:00
Fix up accounts list
Fix hover styles to not grow. Fix back button on accounts list.
This commit is contained in:
parent
4386fdd097
commit
24fc5f9ea3
@ -39,6 +39,7 @@ AccountsScreen.prototype.render = function() {
|
|||||||
onSelect: this.onSelect.bind(this),
|
onSelect: this.onSelect.bind(this),
|
||||||
onShowDetail: this.onShowDetail.bind(this),
|
onShowDetail: this.onShowDetail.bind(this),
|
||||||
revealAccount: this.onRevealAccount.bind(this),
|
revealAccount: this.onRevealAccount.bind(this),
|
||||||
|
goHome: this.goHome.bind(this),
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
|
|
||||||
@ -47,9 +48,7 @@ AccountsScreen.prototype.render = function() {
|
|||||||
// subtitle and nav
|
// subtitle and nav
|
||||||
h('.section-title.flex-center', [
|
h('.section-title.flex-center', [
|
||||||
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
|
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
|
||||||
onClick: (event) => {
|
onClick: actions.goHome,
|
||||||
state.dispatch(actions.goHome())
|
|
||||||
}
|
|
||||||
}),
|
}),
|
||||||
h('h2.page-subtitle', 'Select Account'),
|
h('h2.page-subtitle', 'Select Account'),
|
||||||
]),
|
]),
|
||||||
@ -112,13 +111,13 @@ AccountsScreen.prototype.render = function() {
|
|||||||
isSelected: false,
|
isSelected: false,
|
||||||
isFauceting: isFauceting,
|
isFauceting: isFauceting,
|
||||||
})
|
})
|
||||||
|
const selectedClass = isSelected ? '.selected' : ''
|
||||||
|
|
||||||
return (
|
return (
|
||||||
h('.accounts-list-option.flex-row.flex-space-between.pointer.hover-white', {
|
h(`.accounts-list-option.flex-row.flex-space-between.pointer.hover-white${selectedClass}`, {
|
||||||
key: `account-panel-${identity.address}`,
|
key: `account-panel-${identity.address}`,
|
||||||
style: {
|
style: {
|
||||||
flex: '1 0 auto',
|
flex: '1 0 auto',
|
||||||
background: isSelected ? 'white' : 'none',
|
|
||||||
},
|
},
|
||||||
onClick: (event) => actions.onShowDetail(identity.address, event),
|
onClick: (event) => actions.onShowDetail(identity.address, event),
|
||||||
}, [
|
}, [
|
||||||
@ -177,3 +176,7 @@ AccountsScreen.prototype.onShowDetail = function(address, event){
|
|||||||
AccountsScreen.prototype.onRevealAccount = function() {
|
AccountsScreen.prototype.onRevealAccount = function() {
|
||||||
this.props.dispatch(actions.revealAccount())
|
this.props.dispatch(actions.revealAccount())
|
||||||
}
|
}
|
||||||
|
|
||||||
|
AccountsScreen.prototype.goHome = function() {
|
||||||
|
this.props.dispatch(actions.goHome())
|
||||||
|
}
|
||||||
|
@ -274,10 +274,6 @@ input.large-input {
|
|||||||
height: 120px;
|
height: 120px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.accounts-list-option:hover {
|
|
||||||
transform: scale(1.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.accounts-list-option .identicon-wrapper {
|
.accounts-list-option .identicon-wrapper {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
}
|
}
|
||||||
@ -334,9 +330,6 @@ input.large-input {
|
|||||||
border-bottom: 1px solid #B1B1B1;
|
border-bottom: 1px solid #B1B1B1;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.identity-section .identity-panel:hover {
|
|
||||||
background: #F9F9F9;
|
|
||||||
}
|
|
||||||
|
|
||||||
.identity-section .identity-panel.selected {
|
.identity-section .identity-panel.selected {
|
||||||
background: white;
|
background: white;
|
||||||
@ -347,6 +340,11 @@ input.large-input {
|
|||||||
border-color: orange;
|
border-color: orange;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.identity-section .accounts-list-option:hover,
|
||||||
|
.identity-section .accounts-list-option.selected {
|
||||||
|
background:white;
|
||||||
|
}
|
||||||
|
|
||||||
/* account detail screen */
|
/* account detail screen */
|
||||||
|
|
||||||
.account-detail-section {
|
.account-detail-section {
|
||||||
@ -393,4 +391,4 @@ input.large-input {
|
|||||||
|
|
||||||
.ether-balance-label {
|
.ether-balance-label {
|
||||||
color: #ABA9AA;
|
color: #ABA9AA;
|
||||||
}
|
}
|
||||||
|
@ -107,10 +107,6 @@
|
|||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hover-white:hover {
|
|
||||||
background: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pointer {
|
.pointer {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
@ -166,3 +162,7 @@ hr.horizontal-line {
|
|||||||
margin: 1em 0;
|
margin: 1em 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover-white:hover {
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user