added tooltip

4 files changed, 17 insertions, 6 deletions

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 8e119d3e..14d2f923 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -740,7 +740,7 @@
     "message": "remove"
   },
   "removeAccount": {
-    "message": "Remove account?"
+    "message": "Remove account"
   },
   "removeAccountDescription": {
     "message": "This account will be removed from your wallet. Please make sure you have the original seed phrase or private key for this imported account before continuing. You can import or create accounts again from the account drop-down. "
diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js
index c15ecbc9..c5b577cf 100644
--- a/ui/app/components/account-menu/index.js
+++ b/ui/app/components/account-menu/index.js
@@ -11,6 +11,7 @@ const Identicon = require('../identicon')
 const { formatBalance } = require('../../util')
 const { ENVIRONMENT_TYPE_POPUP } = require('../../../../app/scripts/lib/enums')
 const { getEnvironmentType } = require('../../../../app/scripts/lib/util')
+const Tooltip = require('../tooltip')
 
 
 const {
@@ -202,7 +203,17 @@ AccountMenu.prototype.renderRemoveAccount = function (keyring, address) {
   // Any account that's not from the HD wallet Keyring can be removed
   const type = keyring.type
   const isRemovable = type !== 'HD Key Tree'
-  return isRemovable ? h('a.remove-account-icon', { onClick: (e) => this.removeAccount(e, address) }, '') : null
+  if (isRemovable) {
+    return h(Tooltip, {
+      title: this.context.t('removeAccount'),
+      position: 'bottom',
+    }, [
+        h('a.remove-account-icon', {
+          onClick: (e) => this.removeAccount(e, address),
+        }, ''),
+      ])
+  }
+  return null
 }
 
 AccountMenu.prototype.removeAccount = function (e, address) {
diff --git a/ui/app/components/modals/confirm-remove-account/confirm-remove-account.component.js b/ui/app/components/modals/confirm-remove-account/confirm-remove-account.component.js
index 93be2a4e..d6c0c796 100644
--- a/ui/app/components/modals/confirm-remove-account/confirm-remove-account.component.js
+++ b/ui/app/components/modals/confirm-remove-account/confirm-remove-account.component.js
@@ -26,7 +26,7 @@ class ConfirmRemoveAccount extends Component {
       <div className="modal-container">
         <div className="modal-container__content">
           <div className="modal-container__title">
-            { `${t('removeAccount')}` }
+            { `${t('removeAccount')}` }?
           </div>
           <div className="modal-container__address">
             {addressSummary(this.props.address)}
diff --git a/ui/app/css/itcss/components/account-menu.scss b/ui/app/css/itcss/components/account-menu.scss
index 9bce812e..b14753e2 100644
--- a/ui/app/css/itcss/components/account-menu.scss
+++ b/ui/app/css/itcss/components/account-menu.scss
@@ -87,9 +87,9 @@
     }
 
     .remove-account-icon {
-      width: 25px;
-      padding-left: 10px;
-      height: 25px;
+      width: 15px;
+      margin-left: 10px;
+      height: 15px;
     }
 
     &:hover {