Merge pull request #6969 from MetaMask/developv7.0.0

Master Version Bump

8 files changed, 84 insertions, 148 deletions

diff --git a/ui/app/css/itcss/components/account-dropdown-mini.scss b/ui/app/css/itcss/components/account-dropdown-mini.scss
deleted file mode 100644
index 996993db7..000000000
--- a/ui/app/css/itcss/components/account-dropdown-mini.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-.account-dropdown-mini {
-  height: 22px;
-  background-color: $white;
-  font-family: Roboto;
-  line-height: 16px;
-  font-size: 12px;
-  width: 124px;
-
-  &__close-area {
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 1000;
-    width: 100%;
-    height: 100%;
-  }
-
-  &__list {
-    z-index: 1050;
-    position: absolute;
-    height: 180px;
-    width: 96pxpx;
-    border: 1px solid $geyser;
-    border-radius: 4px;
-    background-color: $white;
-    box-shadow: 0 3px 6px 0 rgba(0 ,0 ,0 ,.11);
-    overflow-y: scroll;
-  }
-
-  .account-list-item {
-    margin-top: 6px;
-  }
-
-  .account-list-item__account-name {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    width: 80px;
-  }
-
-  .account-list-item__top-row {
-    margin: 0;
-  }
-
-  .account-list-item__icon {
-    position: initial;
-  }
-}
\ No newline at end of file
diff --git a/ui/app/css/itcss/components/account-dropdown.scss b/ui/app/css/itcss/components/account-dropdown.scss
index 716404cc3..283b083da 100644
--- a/ui/app/css/itcss/components/account-dropdown.scss
+++ b/ui/app/css/itcss/components/account-dropdown.scss
@@ -84,7 +84,6 @@
   &__account-primary-balance {
     color: $scorpion;
     border: none;
-    outline: 0 !important;
   }
 
   &__account-secondary-balance {
diff --git a/ui/app/css/itcss/components/currency-display.scss b/ui/app/css/itcss/components/currency-display.scss
index b1a74dce2..9ece7a672 100644
--- a/ui/app/css/itcss/components/currency-display.scss
+++ b/ui/app/css/itcss/components/currency-display.scss
@@ -19,7 +19,6 @@
     font-size: 16px;
     line-height: 22px;
     border: none;
-    outline: 0 !important;
     max-width: 22ch;
   }
 
diff --git a/ui/app/css/itcss/components/index.scss b/ui/app/css/itcss/components/index.scss
index 3d426a33c..0e2034670 100644
--- a/ui/app/css/itcss/components/index.scss
+++ b/ui/app/css/itcss/components/index.scss
@@ -1,4 +1,5 @@
 @import '../../../components/ui/button/buttons';
+@import '../../../components/ui/dialog/dialog';
 
 @import './footer.scss';
 
@@ -42,8 +43,6 @@
 
 @import './account-details-dropdown.scss';
 
-@import './account-dropdown-mini.scss';
-
 @import './editable-label.scss';
 
 @import './pages/index.scss';
diff --git a/ui/app/css/itcss/components/new-account.scss b/ui/app/css/itcss/components/new-account.scss
index b3aae8eec..162aac38f 100644
--- a/ui/app/css/itcss/components/new-account.scss
+++ b/ui/app/css/itcss/components/new-account.scss
@@ -3,7 +3,11 @@
   background-color: #FFFFFF;
   box-shadow: 0 0 7px 0 rgba(0,0,0,0.08);
   z-index: 25;
-  height: 100%;
+  height: unset;
+
+  @media screen and (min-width: 576px) {
+    position: absolute;
+  }
 
   &__header {
     display: flex;
diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss
index 9a0b81aed..ff5f6f6cf 100644
--- a/ui/app/css/itcss/components/newui-sections.scss
+++ b/ui/app/css/itcss/components/newui-sections.scss
@@ -65,72 +65,6 @@ $wallet-view-bg: $alabaster;
   @media #{$sub-mid-size-breakpoint-range} {
     min-width: 160px;
   }
-
-  .wallet-view-account-details {
-    flex: 0 0 auto;
-  }
-
-  &__name-container {
-    flex: 0 0 auto;
-    cursor: pointer;
-    width: 100%;
-  }
-
-  &__keyring-label {
-    height: 50px;
-    color: $dusty-gray;
-    font-family: Roboto;
-    font-size: 10px;
-    text-align: right;
-    padding: 17px 20px 0;
-    box-sizing: border-box;
-  }
-
-  &__details-button {
-    font-size: 10px;
-    border-radius: 17px;
-    background-color: transparent;
-    margin: 0 auto;
-    padding: 4px 12px;
-    flex: 0 0 auto;
-  }
-
-  &__tooltip {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 24px;
-  }
-
-  &__address {
-    border-radius: 3px;
-    background-color: $alto;
-    color: $scorpion;
-    font-size: 14px;
-    line-height: 12px;
-    padding: 4px 12px;
-    cursor: pointer;
-    flex: 0 0 auto;
-
-    &__pressed {
-      background-color: $manatee,
-    }
-  }
-
-  &__sidebar-close {
-
-    @media screen and (max-width: 575px) {
-      &::after {
-        content: '\00D7';
-        font-size: 40px;
-        color: $tundora;
-        position: absolute;
-        top: 12px;
-        left: 12px;
-        cursor: pointer;
-      }
-    }
-  }
 }
 
 @media screen and (min-width: 576px) {
@@ -228,20 +162,6 @@ $wallet-view-bg: $alabaster;
   }
 }
 
-// wallet view
-.account-name {
-  font-size: 24px;
-  color: $black;
-  margin-top: 8px;
-  margin-bottom: .9rem;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  width: 100%;
-  padding: 0 8px;
-  text-align: center;
-}
-
 // account options dropdown
 .account-options-menu {
   align-items: center;
diff --git a/ui/app/css/itcss/components/request-signature.scss b/ui/app/css/itcss/components/request-signature.scss
index 6c950d846..25924b6c0 100644
--- a/ui/app/css/itcss/components/request-signature.scss
+++ b/ui/app/css/itcss/components/request-signature.scss
@@ -101,6 +101,30 @@
     font-size: 14px;
   }
 
+  &__account-item {
+    height: 22px;
+    background-color: $white;
+    font-family: Roboto;
+    line-height: 16px;
+    font-size: 12px;
+    width: 124px;
+
+    .account-list-item {
+      margin-top: 6px;
+    }
+
+    .account-list-item__account-name {
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+      width: 80px;
+    }
+
+    .account-list-item__top-row {
+      margin: 0;
+    }
+  }
+
   &__balance {
     color: $dusty-gray;
     margin-right: 17px;
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index c1a7381b6..81678408a 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -536,8 +536,6 @@
   }
 
   &__form {
-    padding: 10px 0 25px;
-
     @media screen and (max-width: $break-small) {
       margin: 0;
       flex: 1 1 auto;
@@ -553,7 +551,7 @@
   }
 
   &__form-row {
-    margin: 8px 18px 0px;
+    margin: 1rem 1rem 0px;
     position: relative;
     display: flex;
     flex-flow: row;
@@ -570,7 +568,6 @@
   &__form-field {
     flex: 1 1 auto;
     min-width: 0;
-    max-width: 277px;
 
     .currency-display {
       color: $tundora;
@@ -646,6 +643,17 @@
     height: 54px;
     border: none;
 
+    &__single-asset {
+      display: flex;
+        flex-flow: row nowrap;
+        align-items: center;
+        padding: 8px 8px;
+
+        &:hover {
+          background-color: rgba($alto, 0.2);
+        }
+    }
+
     &__asset {
       display: flex;
       flex-flow: row nowrap;
@@ -747,16 +755,8 @@
   &__to-autocomplete {
     position: relative;
 
-    &__down-caret {
-      z-index: 1026;
-      position: absolute;
-      top: 18px;
-      right: 12px;
-    }
-
     &__qr-code {
       z-index: 1026;
-      position: absolute;
       top: 13px;
       right: 33px;
       cursor: pointer;
@@ -767,13 +767,52 @@
     &__qr-code:hover {
       background: #f1f1f1;
     }
+  }
 
-    &__input.with-qr {
-      padding-right: 65px;
+  &__to-autocomplete {
+    display: flex;
+    flex-direction: row;
+    z-index: 1025;
+    position: relative;
+    height: 54px;
+    width: 100%;
+    border: 1px solid $Grey-100;
+    border-radius: 8px;
+    background-color: $white;
+    color: $tundora;
+    padding: 0 10px;
+    font-family: Roboto;
+    line-height: 21px;
+    align-items: center;
+
+    &__input {
+      font-size: 16px;
+      height: 100%;
+      border: none;
+      flex: 1 1 auto;
+      width: 0;
+
+      &::placeholder {
+        color: #A1A5B3;
+      }
+    }
+
+    &__resolved {
+      font-size: 12px;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+      height: 30px;
+      cursor: pointer;
+
+      + .send-v2__to-autocomplete__qr-code {
+        top: 2px;
+        right: 0;
+      }
     }
   }
 
-  &__to-autocomplete, &__memo-text-area, &__hex-data {
+  &__memo-text-area, &__hex-data {
     &__input {
       z-index: 1025;
       position: relative;