From c3e2afde87e21b53b8bdb6624aa9f57d58c95701 Mon Sep 17 00:00:00 2001
From: Vitaliy Vlasov <siphiuel@gmail.com>
Date: Tue, 1 Oct 2019 17:23:36 +0300
Subject: [PATCH] Fix enter-phrase input layout issues

---
 .../ui/components/text_input/view.cljs        |  2 +-
 src/status_im/ui/screens/intro/views.cljs     | 54 +++++++++----------
 2 files changed, 27 insertions(+), 29 deletions(-)

diff --git a/src/status_im/ui/components/text_input/view.cljs b/src/status_im/ui/components/text_input/view.cljs
index d8b489328a0..a6e63bbd150 100644
--- a/src/status_im/ui/components/text_input/view.cljs
+++ b/src/status_im/ui/components/text_input/view.cljs
@@ -19,7 +19,7 @@
            parent-container bottom-value text editable keyboard-type]
     :as props
     :or {editable true}}]
-  [react/view
+  [react/view {:style parent-container}
    (when label
      [react/text {:style (styles/label editable)}
       label])
diff --git a/src/status_im/ui/screens/intro/views.cljs b/src/status_im/ui/screens/intro/views.cljs
index 0ca6d23135c..ae9a0930bd4 100644
--- a/src/status_im/ui/screens/intro/views.cljs
+++ b/src/status_im/ui/screens/intro/views.cljs
@@ -18,6 +18,7 @@
             [status-im.ui.components.common.common :as components.common]
             [status-im.ui.screens.intro.styles :as styles]
             [status-im.ui.components.toolbar.view :as toolbar]
+            [status-im.utils.platform :as platform]
             [status-im.utils.security :as security]
             [status-im.i18n :as i18n]
             [status-im.ui.components.status-bar.view :as status-bar]
@@ -334,34 +335,31 @@
   [react/keyboard-avoiding-view {:flex             1
                                  :justify-content  :space-between
                                  :background-color colors/white}
-   [react/view {:flex 1
-                :justify-content :center
-                :align-items    :center}
-    [text-input/text-input-with-label
-     {:on-change-text      #(re-frame/dispatch [:multiaccounts.recover/enter-phrase-input-changed (security/mask-data %)])
-      :auto-focus          true
-      :error               (when passphrase-error (i18n/label passphrase-error))
-      :accessibility-label :passphrase-input
-      :placeholder         nil
-      :bottom-value        40
-      :multiline           true
-      :auto-correct        false
-      :keyboard-type       "visible-password"
-      :parent-container    {:flex 1
-                            :align-self :stretch
-                            :justify-content :center
-                            :align-items :center}
-      :container           {:background-color :white
-                            :flex 1
-                            :justify-content :center
-                            :align-items :center}
-      :style               {:background-color :white
-                            :text-align       :center
-                            ;:height 75
-                            :flex 1
-                            :flex-wrap :wrap
-                            :font-size        16
-                            :font-weight      "700"}}]]
+   [text-input/text-input-with-label
+    {:on-change-text      #(re-frame/dispatch [:multiaccounts.recover/enter-phrase-input-changed (security/mask-data %)])
+     :auto-focus          true
+     :error               (when passphrase-error (i18n/label passphrase-error))
+     :accessibility-label :passphrase-input
+     :placeholder         nil
+     :bottom-value        40
+     :multiline           true
+     :auto-correct        false
+     :keyboard-type       "visible-password"
+     :parent-container    {:flex 1
+                           :align-self :stretch
+                           :justify-content :center
+                           :align-items :center}
+     :container           {:background-color :white
+                           :flex 1
+                           :justify-content :center
+                           :align-items :center}
+     :style               (merge {:background-color    :white
+                                  :text-align          :center
+                                  :text-align-vertical :center
+                                  :font-size        16
+                                  :font-weight      "700"}
+                                 (when platform/android?
+                                   {:flex 1}))}]
    [react/view {:align-items :center}
     (when passphrase-word-count
       [react/view {:flex-direction :row