Fix up accounts list

Fix hover styles to not grow.
Fix back button on accounts list.
This commit is contained in:
Dan Finlay 2016-05-20 14:11:59 -07:00
parent 4386fdd097
commit 24fc5f9ea3
3 changed files with 18 additions and 17 deletions

View File

@ -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())
}

View File

@ -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 {

View File

@ -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;
}