From 0d522139ba7c5372e0ef4219a69a4b8e8f83706a Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Wed, 25 Oct 2017 01:08:14 -0700
Subject: Fix gas input styling on mobile view

---
 ui/app/css/itcss/components/confirm.scss |  4 +++-
 ui/app/css/itcss/components/send.scss    | 30 ++++++++++++++++++++++++------
 2 files changed, 27 insertions(+), 7 deletions(-)

(limited to 'ui/app/css/itcss/components')

diff --git a/ui/app/css/itcss/components/confirm.scss b/ui/app/css/itcss/components/confirm.scss
index 03da5acb6..4a8232e39 100644
--- a/ui/app/css/itcss/components/confirm.scss
+++ b/ui/app/css/itcss/components/confirm.scss
@@ -85,8 +85,10 @@
   background: $athens-grey;
   position: absolute;
   transform: rotate(45deg);
-  left: 178px;
   top: 71px;
+  left: 0;
+  right: 0;
+  margin: 0 auto;
 }
 
 .confirm-screen-title {
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index 458434de4..a8d46067b 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -274,6 +274,7 @@
   color: #9b9b9b;
   font-size: .8em;
   padding: 1px 4px;
+  cursor: pointer;
 }
 
 .token-gas {
@@ -474,6 +475,7 @@
 
     @media screen and (max-width: $break-small) {
       height: 59px;
+      width: 100vw;
     }
   }
 
@@ -484,10 +486,13 @@
     position: absolute;
     transform: rotate(45deg);
     left: 178px;
-    top: 65px;
+    top: 75px;
 
     @media screen and (max-width: $break-small) {
       top: 46px;
+      left: 0;
+      right: 0;
+      margin: 0 auto;
     }
   }
 
@@ -706,8 +711,8 @@
     flex-flow: column;
 
     @media screen and (max-width: $break-small) {
-      width: 355px;
-      height: 598px;
+      width: 100vw;
+      height: 100vh;
     }
 
     &__header {
@@ -717,6 +722,10 @@
       align-items: center;
       justify-content: space-between;
       font-size: 22px;
+
+      @media screen and (max-width: $break-small) {
+        flex: 0 0 auto;
+      }
     }
 
     &__title {
@@ -732,14 +741,19 @@
       margin-right: 19.25px;
     }
 
+    &__content {
+      display: flex;
+      flex-flow: column nowrap;
+      height: 100%;
+    }
+
     &__body {
-      height: 248px;
       display: flex;
+      margin-bottom: 24px;
 
       @media screen and (max-width: $break-small) {
-        width: 355px;
-        height: 470px;
         flex-flow: column;
+        flex: 1 1 auto;
       }
     }
 
@@ -751,6 +765,10 @@
       justify-content: space-between;
       font-size: 22px;
       position: relative;
+
+      @media screen and (max-width: $break-small) {
+        flex: 0 0 auto;
+      }
     }
 
     &__buttons {
-- 
cgit v1.2.3