Add import account disclaimer

2 files changed, 23 insertions, 5 deletions

diff --git a/old-ui/app/accounts/import/index.js b/old-ui/app/accounts/import/index.js
index 3502efe93..a57525ccf 100644
--- a/old-ui/app/accounts/import/index.js
+++ b/old-ui/app/accounts/import/index.js
@@ -34,10 +34,7 @@ AccountImportSubview.prototype.render = function () {
   const { type } = state
 
   return (
-    h('div', {
-      style: {
-      },
-    }, [
+    h('div', [
       h('.section-title.flex-row.flex-center', [
         h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
           onClick: (event) => {
@@ -46,6 +43,27 @@ AccountImportSubview.prototype.render = function () {
         }),
         h('h2.page-subtitle', 'Import Accounts'),
       ]),
+      h('.error', {
+        style: {
+          display: 'inline-block',
+          alignItems: 'center',
+          padding: '5px 15px 0px 15px',
+        },
+      }, [
+        h('span', 'Imported accounts will not be associated with your originally created MetaMask account seedphrase. Learn more about imported accounts '),
+        h('span', {
+          style: {
+            color: 'rgba(247, 134, 28, 1)',
+            cursor: 'pointer',
+            textDecoration: 'underline',
+          },
+          onClick: () => {
+            global.platform.openWindow({
+              url: 'https://metamask.helpscoutdocs.com/article/17-what-are-loose-accounts',
+            })
+          },
+        }, 'here.'),
+      ]),
       h('div', {
         style: {
           padding: '10px',
diff --git a/old-ui/app/css/lib.css b/old-ui/app/css/lib.css
index f3acbee76..fd63b2b2e 100644
--- a/old-ui/app/css/lib.css
+++ b/old-ui/app/css/lib.css
@@ -217,7 +217,7 @@ hr.horizontal-line {
   background: rgba(255,0,0,0.8);
   color: white;
   bottom: 0px;
-  left: -8px;
+  left: -18px;
   border-radius: 10px;
   height: 20px;
   min-width: 20px;