Import Account disclaimer

2 files changed, 12 insertions, 9 deletions

diff --git a/ui/app/accounts/import/index.js b/ui/app/accounts/import/index.js
index 7e7d3aa91..adb52db74 100644
--- a/ui/app/accounts/import/index.js
+++ b/ui/app/accounts/import/index.js
@@ -35,17 +35,10 @@ AccountImportSubview.prototype.render = function () {
   return (
     h('div.new-account-import-form', [
 
-      h('.warning', {
-        style: {
-          display: 'inline-block',
-          alignItems: 'center',
-          padding: '15px 15px 0px 15px',
-        },
-      }, [
+      h('.new-account-import-disclaimer', [
         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',
           },
@@ -54,7 +47,7 @@ AccountImportSubview.prototype.render = function () {
               url: 'https://metamask.helpscoutdocs.com/article/17-what-are-loose-accounts',
             })
           },
-        }, 'here.'),
+        }, 'here'),
       ]),
 
       h('div.new-account-import-form__select-section', [
diff --git a/ui/app/css/itcss/components/new-account.scss b/ui/app/css/itcss/components/new-account.scss
index 81f919df3..c6c254ede 100644
--- a/ui/app/css/itcss/components/new-account.scss
+++ b/ui/app/css/itcss/components/new-account.scss
@@ -54,6 +54,16 @@
 
 }
 
+.new-account-import-disclaimer {
+  width: 120%;
+  background-color: #F4F9FC;
+  display: inline-block;
+  align-items: center;
+  padding: 20px 30px 20px;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
 .new-account-import-form {
   display: flex;
   flex-flow: column;