Merge branch 'testing' of https://github.com/tmashuang/metamask-extension into testing

12 files changed, 144 insertions, 5 deletions

diff --git a/ui/app/css/itcss/components/add-token.scss b/ui/app/css/itcss/components/add-token.scss
index 2fdda6f43..01579c27c 100644
--- a/ui/app/css/itcss/components/add-token.scss
+++ b/ui/app/css/itcss/components/add-token.scss
@@ -36,6 +36,7 @@
         font-weight: 400;
         line-height: 21px;
         margin-left: 8px;
+        cursor:pointer;
       }
     }
 
diff --git a/ui/app/css/itcss/components/index.scss b/ui/app/css/itcss/components/index.scss
index ffd43ecbf..1c544e162 100644
--- a/ui/app/css/itcss/components/index.scss
+++ b/ui/app/css/itcss/components/index.scss
@@ -52,6 +52,8 @@
 
 @import './editable-label.scss';
 
+@import './pages/index.scss';
+
 @import './new-account.scss';
 
 @import './tooltip.scss';
@@ -59,3 +61,5 @@
 @import './welcome-screen.scss';
 
 @import './sender-to-recipient.scss';
+
+@import '../../../components/export-text-container/export-text-container.scss';
diff --git a/ui/app/css/itcss/components/loading-overlay.scss b/ui/app/css/itcss/components/loading-overlay.scss
index 15009c1e6..c18b7fa59 100644
--- a/ui/app/css/itcss/components/loading-overlay.scss
+++ b/ui/app/css/itcss/components/loading-overlay.scss
@@ -1,13 +1,14 @@
 .loading-overlay {
-  left: 0px;
+  left: 0;
   z-index: 50;
   position: absolute;
   flex-direction: column;
   display: flex;
   justify-content: center;
   align-items: center;
+  flex: 1 1 auto;
   width: 100%;
-  background: rgba(255, 255, 255, 0.8);
+  background: rgba(255, 255, 255, .8);
 
   @media screen and (max-width: 575px) {
     margin-top: 56px;
@@ -18,4 +19,32 @@
     margin-top: 75px;
     height: calc(100% - 75px);
   }
+
+  &--full-screen {
+    position: fixed;
+    height: 100vh;
+    width: 100vw;
+    margin-top: 0;
+  }
+
+  &__container {
+    position: absolute;
+    top: 33%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+
+  &__message {
+    margin-top: 32px;
+    font-weight: 400;
+    font-size: 20px;
+    color: $manatee;
+  }
+}
+
+.spinner {
+  height: 58px;
+  width: 58px;
 }
diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss
index c34b5cd06..6c8be0b6d 100644
--- a/ui/app/css/itcss/components/network.scss
+++ b/ui/app/css/itcss/components/network.scss
@@ -139,7 +139,7 @@
 
 .network-dropdown-title {
   height: 25px;
-  width: 75px;
+  width: 120px;
   color: $white;
   font-family: Roboto;
   font-size: 18px;
diff --git a/ui/app/css/itcss/components/new-account.scss b/ui/app/css/itcss/components/new-account.scss
index aa7fed956..293579058 100644
--- a/ui/app/css/itcss/components/new-account.scss
+++ b/ui/app/css/itcss/components/new-account.scss
@@ -35,13 +35,14 @@
       font-size: 18px;
       line-height: 24px;
       text-align: center;
+      cursor: pointer;
     }
 
     &__tab:first-of-type {
       margin-right: 20px;
     }
 
-    &__unselected:hover {
+    &__tab:hover {
       color: $black;
       border-bottom: none;
     }
@@ -49,9 +50,9 @@
     &__selected {
       color: $curious-blue;
       border-bottom: 3px solid $curious-blue;
+      cursor: initial;
     }
   }
-
 }
 
 .new-account-import-disclaimer {
diff --git a/ui/app/css/itcss/components/pages/index.scss b/ui/app/css/itcss/components/pages/index.scss
new file mode 100644
index 000000000..d0b59da53
--- /dev/null
+++ b/ui/app/css/itcss/components/pages/index.scss
@@ -0,0 +1,3 @@
+@import './unlock.scss';
+
+@import './reveal-seed.scss';
diff --git a/ui/app/css/itcss/components/pages/reveal-seed.scss b/ui/app/css/itcss/components/pages/reveal-seed.scss
new file mode 100644
index 000000000..b8f13af4a
--- /dev/null
+++ b/ui/app/css/itcss/components/pages/reveal-seed.scss
@@ -0,0 +1,17 @@
+.reveal-seed {
+  &__content {
+    padding: 20px;
+  }
+
+  &__label {
+    padding-bottom: 10px;
+    font-weight: 400;
+    display: inline-block;
+  }
+
+  &__error {
+    color: $crimson;
+    font-size: 14px;
+    padding-top: 5px;
+  }
+}
diff --git a/ui/app/css/itcss/components/pages/unlock.scss b/ui/app/css/itcss/components/pages/unlock.scss
new file mode 100644
index 000000000..5d438377b
--- /dev/null
+++ b/ui/app/css/itcss/components/pages/unlock.scss
@@ -0,0 +1,9 @@
+.unlock-page {
+  box-shadow: none;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background: rgb(247, 247, 247);
+  width: 100%;
+}
diff --git a/ui/app/css/itcss/components/sections.scss b/ui/app/css/itcss/components/sections.scss
index 388aea175..ace46bd8a 100644
--- a/ui/app/css/itcss/components/sections.scss
+++ b/ui/app/css/itcss/components/sections.scss
@@ -17,6 +17,12 @@ textarea.twelve-word-phrase {
   resize: none;
 }
 
+.initialize-screen {
+  width: 100%;
+  z-index: $main-container-z-index;
+  background: #f7f7f7;
+}
+
 .initialize-screen hr {
   width: 60px;
   margin: 12px;
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index 89d2be891..362feeec8 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -789,6 +789,7 @@
       display: flex;
       justify-content: center;
       align-items: center;
+      padding: 0 3px;
       cursor: pointer;
     }
 
diff --git a/ui/app/css/itcss/generic/index.scss b/ui/app/css/itcss/generic/index.scss
index 92321394b..7a64810c4 100644
--- a/ui/app/css/itcss/generic/index.scss
+++ b/ui/app/css/itcss/generic/index.scss
@@ -207,6 +207,27 @@ input.large-input {
   &__content {
     height: 100%;
     overflow-y: auto;
+    min-height: 250px;
+    max-height: 400px;
+  }
+
+  &__warning-container {
+    background: $linen;
+    padding: 20px;
+    display: flex;
+    align-items: start;
+  }
+
+  &__warning-message {
+    padding-left: 15px;
+  }
+
+  &__warning-title {
+    font-weight: 500;
+  }
+
+  &__warning-icon {
+    padding-top: 5px;
   }
 }
 
@@ -237,3 +258,49 @@ input.large-input {
     border-radius: 0;
   }
 }
+
+@media screen and (min-width: 576px) {
+  .page-container {
+    height: 600px;
+    flex: 0 0 auto;
+  }
+}
+
+.input-label {
+  padding-bottom: 10px;
+  font-weight: 400;
+  display: inline-block;
+}
+
+input.form-control {
+  padding-left: 10px;
+  font-size: 14px;
+  height: 40px;
+  border: 1px solid $alto;
+  border-radius: 3px;
+  width: 100%;
+
+  &::-webkit-input-placeholder {
+    font-weight: 100;
+    color: $dusty-gray;
+  }
+
+  &::-moz-placeholder {
+    font-weight: 100;
+    color: $dusty-gray;
+  }
+
+  &:-ms-input-placeholder {
+    font-weight: 100;
+    color: $dusty-gray;
+  }
+
+  &:-moz-placeholder {
+    font-weight: 100;
+    color: $dusty-gray;
+  }
+
+  &--error {
+    border: 1px solid $monzo;
+  }
+}
diff --git a/ui/app/css/itcss/settings/variables.scss b/ui/app/css/itcss/settings/variables.scss
index 51548306f..814d7a382 100644
--- a/ui/app/css/itcss/settings/variables.scss
+++ b/ui/app/css/itcss/settings/variables.scss
@@ -54,6 +54,7 @@ $saffron: #f6c343;
 $dodger-blue: #3099f2;
 $zumthor: #edf7ff;
 $ecstasy: #f7861c;
+$linen: #fdf4f4;
 
 /*
   Z-Indicies