added tooltip

4 files changed, 17 insertions, 6 deletions

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 8e119d3e4..14d2f923a 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 c15ecbc9c..c5b577cfd 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 93be2a4e7..d6c0c796d 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 9bce812e6..b14753e23 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 {