fix conflicts

9 files changed, 82 insertions, 241 deletions

diff --git a/ui/app/css/itcss/components/account-details-dropdown.scss b/ui/app/css/itcss/components/account-details-dropdown.scss
new file mode 100644
index 000000000..2a3007f83
--- /dev/null
+++ b/ui/app/css/itcss/components/account-details-dropdown.scss
@@ -0,0 +1,7 @@
+.account-details-dropdown {
+	width: 60%;
+	position: absolute;
+	top: 120px;
+	right: 15px;
+	z-index: 2000;
+}
\ No newline at end of file
diff --git a/ui/app/css/itcss/components/buttons.scss b/ui/app/css/itcss/components/buttons.scss
index 34565767f..655188a3e 100644
--- a/ui/app/css/itcss/components/buttons.scss
+++ b/ui/app/css/itcss/components/buttons.scss
@@ -2,10 +2,7 @@
   Buttons
  */
 
-.btn-default,
-.btn-primary,
-.btn-secondary,
-.btn-confirm {
+.button {
   height: 44px;
   background: $white;
   display: flex;
@@ -79,6 +76,16 @@
   background-color: $curious-blue;
 }
 
+.btn-raised {
+  color: $curious-blue;
+  background-color: $white;
+  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
+  padding: 6px;
+  height: initial;
+  width: initial;
+  min-width: initial;
+}
+
 .btn--large {
   height: 54px;
 }
diff --git a/ui/app/css/itcss/components/index.scss b/ui/app/css/itcss/components/index.scss
index 9e2008b54..63aa62eb3 100644
--- a/ui/app/css/itcss/components/index.scss
+++ b/ui/app/css/itcss/components/index.scss
@@ -36,14 +36,14 @@
 
 @import './gas-slider.scss';
 
-@import './settings.scss';
-
 @import './tab-bar.scss';
 
 @import './simple-dropdown.scss';
 
 @import './request-signature.scss';
 
+@import './account-details-dropdown.scss';
+
 @import './account-dropdown-mini.scss';
 
 @import './editable-label.scss';
diff --git a/ui/app/css/itcss/components/loading-overlay.scss b/ui/app/css/itcss/components/loading-overlay.scss
index b07d6af17..b023c8423 100644
--- a/ui/app/css/itcss/components/loading-overlay.scss
+++ b/ui/app/css/itcss/components/loading-overlay.scss
@@ -1,6 +1,6 @@
 .loading-overlay {
   left: 0;
-  z-index: 50;
+  z-index: 51;
   position: absolute;
   flex-direction: column;
   display: flex;
@@ -8,25 +8,9 @@
   align-items: center;
   flex: 1 1 auto;
   width: 100%;
+  height: 100%;
   background: rgba(255, 255, 255, .8);
 
-  @media screen and (max-width: 575px) {
-    margin-top: 66px;
-    height: calc(100% - 66px);
-  }
-
-  @media screen and (min-width: 576px) {
-    margin-top: 75px;
-    height: calc(100% - 75px);
-  }
-
-  &--full-screen {
-    position: fixed;
-    height: 100vh;
-    width: 100vw;
-    margin-top: 0;
-  }
-
   &__container {
     position: absolute;
     top: 33%;
diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss
index b23876d01..833a91f12 100644
--- a/ui/app/css/itcss/components/network.scss
+++ b/ui/app/css/itcss/components/network.scss
@@ -59,6 +59,15 @@
   font-weight: 500;
 }
 
+.dropdown-menu-item .fa.delete {
+    margin-right: 10px;
+    display: none;
+}
+
+.dropdown-menu-item:hover .fa.delete {
+    display: inherit;
+}
+
 .network-droppo {
   right: 2px;
 
diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss
index 7eb193d6f..8e963d495 100644
--- a/ui/app/css/itcss/components/newui-sections.scss
+++ b/ui/app/css/itcss/components/newui-sections.scss
@@ -22,6 +22,12 @@ $wallet-view-bg: $alabaster;
   display: none;
 }
 
+.main-container-wrapper {
+  display: flex;
+  width: 100vw;
+  justify-content: center;
+}
+
 //Account and transaction details
 .account-and-transaction-details {
   display: flex;
@@ -219,6 +225,10 @@ $wallet-view-bg: $alabaster;
     overflow-y: auto;
     background-color: $white;
   }
+
+  .main-container-wrapper {
+    height: 100%;
+  }
 }
 
 // wallet view
diff --git a/ui/app/css/itcss/components/request-signature.scss b/ui/app/css/itcss/components/request-signature.scss
index b607aded3..445b9ebf5 100644
--- a/ui/app/css/itcss/components/request-signature.scss
+++ b/ui/app/css/itcss/components/request-signature.scss
@@ -23,6 +23,25 @@
     }
   }
 
+  &__typed-container {
+    padding: 17px;
+
+    h1 {
+      font-weight: 900;
+      margin-bottom: 5px;
+    }
+
+    * {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    > div {
+      margin-bottom: 10px;
+    }
+  }
+
   &__header {
     height: 64px;
     width: 100%;
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index 806ac8536..a57653b45 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -622,12 +622,14 @@
     position: relative;
 
     &__down-caret {
+      z-index: 1026;
       position: absolute;
       top: 18px;
       right: 12px;
     }
 
     &__qr-code {
+      z-index: 1026;
       position: absolute;
       top: 13px;
       right: 33px;
@@ -647,6 +649,8 @@
 
   &__to-autocomplete, &__memo-text-area, &__hex-data {
     &__input {
+      z-index: 1025;
+      position: relative;
       height: 54px;
       width: 100%;
       border: 1px solid $alto;
@@ -827,11 +831,17 @@
     &__error-message {
       display: block;
       position: absolute;
-      top: 4px;
-      right: 4px;
+      top: -18px;
+      right: 0;
       font-size: 12px;
       line-height: 12px;
       color: $red;
+      width: 100%;
+      text-align: center;
+    }
+
+    &__cancel {
+      margin-right: 10px;
     }
   }
 
@@ -880,12 +890,21 @@
       font-size: 18px;
       color: $tundora;
       right: 0px;
-      padding: 1px 4px;
+      padding: 0;
       display: flex;
       justify-content: space-around;
       align-items: center;
     }
 
+    .gas-tooltip-input-arrow-wrapper {
+      align-items: center;
+      align-self: stretch;
+      display: flex;
+      flex-direction: column;
+      flex-grow: 1;
+      justify-content: center;
+    }
+
     input[type="number"]::-webkit-inner-spin-button {
       -webkit-appearance: none;
       display: none;
diff --git a/ui/app/css/itcss/components/settings.scss b/ui/app/css/itcss/components/settings.scss
deleted file mode 100644
index 0dd61ac5e..000000000
--- a/ui/app/css/itcss/components/settings.scss
+++ /dev/null
@@ -1,214 +0,0 @@
-.settings {
-  position: relative;
-  background: $white;
-  display: flex;
-  flex-flow: column nowrap;
-}
-
-.settings__header {
-  padding: 25px;
-}
-
-.settings__close-button::after {
-  content: '\00D7';
-  font-size: 40px;
-  color: $dusty-gray;
-  position: absolute;
-  top: 25px;
-  right: 30px;
-  cursor: pointer;
-}
-
-.settings__error {
-  padding-bottom: 20px;
-  text-align: center;
-  color: $crimson;
-}
-
-.settings__content {
-  padding: 0 25px;
-  height: auto;
-  overflow: auto;
-}
-
-.settings__content-row {
-  display: flex;
-  flex-direction: row;
-  padding: 10px 0 20px;
-
-  @media screen and (max-width: 575px) {
-    flex-direction: column;
-    padding: 10px 0;
-  }
-}
-
-.settings__content-item {
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-  padding: 0 5px;
-  height: 71px;
-
-  @media screen and (max-width: 575px) {
-    height: initial;
-    padding: 5px 0;
-  }
-
-  &--without-height {
-    height: initial;
-  }
-}
-
-.settings__content-item-col {
-  max-width: 300px;
-  display: flex;
-  flex-direction: column;
-
-  @media screen and (max-width: 575px) {
-    max-width: 100%;
-    width: 100%;
-  }
-}
-
-.settings__content-description {
-  font-size: 14px;
-  color: $dusty-gray;
-  padding-top: 5px;
-}
-
-.settings__input {
-  padding-left: 10px;
-  font-size: 14px;
-  height: 40px;
-  border: 1px solid $alto;
-}
-
-.settings__input::-webkit-input-placeholder {
-  font-weight: 100;
-  color: $dusty-gray;
-}
-
-.settings__input::-moz-placeholder {
-  font-weight: 100;
-  color: $dusty-gray;
-}
-
-.settings__input:-ms-input-placeholder {
-  font-weight: 100;
-  color: $dusty-gray;
-}
-
-.settings__input:-moz-placeholder {
-  font-weight: 100;
-  color: $dusty-gray;
-}
-
-.settings__provider-wrapper {
-  font-size: 16px;
-  border: 1px solid $alto;
-  border-radius: 2px;
-  padding: 15px;
-  background-color: $white;
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-}
-
-.settings__provider-icon {
-  height: 10px;
-  width: 10px;
-  margin-right: 10px;
-  border-radius: 10px;
-}
-
-.settings__rpc-save-button {
-  align-self: flex-end;
-  padding: 5px;
-  text-transform: uppercase;
-  color: $dusty-gray;
-  cursor: pointer;
-}
-
-.settings__button--red {
-  border-color: lighten($monzo, 10%);
-  color: $monzo;
-
-  &:active {
-    background: lighten($monzo, 55%);
-    border-color: $monzo;
-  }
-
-  &:hover {
-    border-color: $monzo;
-  }
-}
-
-.settings__button--orange {
-  border-color: lighten($ecstasy, 20%);
-  color: $ecstasy;
-
-  &:active {
-    background: lighten($ecstasy, 40%);
-    border-color: $ecstasy;
-  }
-
-  &:hover {
-    border-color: $ecstasy;
-  }
-}
-
-.settings__info-logo-wrapper {
-  height: 80px;
-  margin-bottom: 20px;
-}
-
-.settings__info-logo {
-  max-height: 100%;
-  max-width: 100%;
-}
-
-.settings__info-item {
-  padding: 10px 0;
-}
-
-.settings__info-link-header {
-  padding-bottom: 15px;
-
-  @media screen and (max-width: 575px) {
-    padding-bottom: 5px;
-  }
-}
-
-.settings__info-link-item {
-  padding: 15px 0;
-
-  @media screen and (max-width: 575px) {
-    padding: 5px 0;
-  }
-}
-
-.settings__info-version-number {
-  padding-top: 5px;
-  font-size: 13px;
-  color: $dusty-gray;
-}
-
-.settings__info-about {
-  color: $dusty-gray;
-  margin-bottom: 15px;
-}
-
-.settings__info-link {
-  color: $curious-blue;
-}
-
-.settings__info-separator {
-  margin: 15px 0;
-  width: 80px;
-  border-color: $alto;
-  border: none;
-  height: 1px;
-  background-color: $alto;
-  color: $alto;
-}