1 files changed, 23 insertions, 27 deletions

diff --git a/ui/app/accounts/import/index.js b/ui/app/accounts/import/index.js
index 97b387229..c1b190e3d 100644
--- a/ui/app/accounts/import/index.js
+++ b/ui/app/accounts/import/index.js
@@ -2,7 +2,7 @@ const inherits = require('util').inherits
 const Component = require('react').Component
 const h = require('react-hyperscript')
 const connect = require('react-redux').connect
-const actions = require('../../actions')
+const t = require('../../../i18n')
 import Select from 'react-select'
 
 // Subviews
@@ -10,8 +10,8 @@ const JsonImportView = require('./json.js')
 const PrivateKeyImportView = require('./private-key.js')
 
 const menuItems = [
-  'Private Key',
-  'JSON File',
+  t('privateKey'),
+  t('jsonFile'),
 ]
 
 module.exports = connect(mapStateToProps)(AccountImportSubview)
@@ -34,34 +34,29 @@ AccountImportSubview.prototype.render = function () {
   const { type } = state
 
   return (
-    h('div', {
-      style: {
-      },
-    }, [
-      h('.section-title.flex-row.flex-center', [
-        h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
-          onClick: (event) => {
-            props.dispatch(actions.goHome())
+    h('div.new-account-import-form', [
+
+      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: {
+            cursor: 'pointer',
+            textDecoration: 'underline',
           },
-        }),
-        h('h2.page-subtitle', 'Import Accounts'),
+          onClick: () => {
+            global.platform.openWindow({
+              url: 'https://metamask.helpscoutdocs.com/article/17-what-are-loose-accounts',
+            })
+          },
+        }, 'here'),
       ]),
-      h('div', {
-        style: {
-          padding: '10px',
-          color: 'rgb(174, 174, 174)',
-        },
-      }, [
 
-        h('h3', { style: { padding: '3px' } }, 'SELECT TYPE'),
+      h('div.new-account-import-form__select-section', [
 
-        h('style', `
-          .has-value.Select--single > .Select-control .Select-value .Select-value-label, .Select-value-label {
-            color: rgb(174,174,174);
-          }
-        `),
+        h('div.new-account-import-form__select-label', 'Select Type'),
 
         h(Select, {
+          className: 'new-account-import-form__select',
           name: 'import-type-select',
           clearable: false,
           value: type || menuItems[0],
@@ -75,6 +70,7 @@ AccountImportSubview.prototype.render = function () {
             this.setState({ type: opt.value })
           },
         }),
+
       ]),
 
       this.renderImportView(),
@@ -90,9 +86,9 @@ AccountImportSubview.prototype.renderImportView = function () {
   const current = type || menuItems[0]
 
   switch (current) {
-    case 'Private Key':
+    case t('privateKey'):
       return h(PrivateKeyImportView)
-    case 'JSON File':
+    case t('jsonFile'):
       return h(JsonImportView)
     default:
       return h(JsonImportView)