Fix account list formatting when only a single item.

- Makes account list items no longer flex larger than they should be.
- Makes the add account button not flex larger than it should be.
- Adds a line under the add account button to define its size.

2 files changed, 7 insertions, 10 deletions

diff --git a/ui/app/accounts/account-list-item.js b/ui/app/accounts/account-list-item.js
index 0b4acdfec..4e0d69ed7 100644
--- a/ui/app/accounts/account-list-item.js
+++ b/ui/app/accounts/account-list-item.js
@@ -7,14 +7,14 @@ const EthBalance = require('../components/eth-balance')
 const CopyButton = require('../components/copyButton')
 const Identicon = require('../components/identicon')
 
-module.exports = NewComponent
+module.exports = AccountListItem
 
-inherits(NewComponent, Component)
-function NewComponent () {
+inherits(AccountListItem, Component)
+function AccountListItem () {
   Component.call(this)
 }
 
-NewComponent.prototype.render = function () {
+AccountListItem.prototype.render = function () {
   const identity = this.props.identity
   var isSelected = this.props.selectedAddress === identity.address
   var account = this.props.accounts[identity.address]
@@ -23,9 +23,6 @@ NewComponent.prototype.render = function () {
   return (
     h(`.accounts-list-option.flex-row.flex-space-between.pointer.hover-white${selectedClass}`, {
       key: `account-panel-${identity.address}`,
-      style: {
-        flex: '1 0 auto',
-      },
       onClick: (event) => this.props.onShowDetail(identity.address, event),
     }, [
 
@@ -73,7 +70,7 @@ NewComponent.prototype.render = function () {
   )
 }
 
-NewComponent.prototype.pendingOrNot = function () {
+AccountListItem.prototype.pendingOrNot = function () {
   const pending = this.props.pending
   if (pending.length === 0) return null
   return h('.pending-dot', pending.length)
diff --git a/ui/app/accounts/index.js b/ui/app/accounts/index.js
index c20900c1e..d3c84d387 100644
--- a/ui/app/accounts/index.js
+++ b/ui/app/accounts/index.js
@@ -84,7 +84,7 @@ AccountsScreen.prototype.render = function () {
             })
           }),
 
-          h('hr.horizontal-line', {key: 'horizontal-line1'}),
+          h('hr.horizontal-line'),
           h('div.footer.hover-white.pointer', {
             key: 'reveal-account-bar',
             onClick: () => {
@@ -92,7 +92,6 @@ AccountsScreen.prototype.render = function () {
             },
             style: {
               display: 'flex',
-              flex: '1 0 auto',
               height: '40px',
               paddint: '10px',
               justifyContent: 'center',
@@ -101,6 +100,7 @@ AccountsScreen.prototype.render = function () {
           }, [
             h('i.fa.fa-plus.fa-lg', {key: ''}),
           ]),
+          h('hr.horizontal-line'),
         ]),
 
       unconfTxList.length ? (