[FIX #3223] Fit Recipient screen to mocks on iOS

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>

src/status_im/ui/screens/wallet/components.cljs

@@ -27,10 +27,12 @@
 (def default-action (actions/back-white actions/default-handler))
 
 (defn- toolbar
-  ([title] (toolbar default-action title))
+  ([title] (toolbar {} title))
-  ([action title] (toolbar action title nil))
+  ([props title] (toolbar props default-action title))
-  ([action title options]
+  ([props action title] (toolbar props action title nil))
-   [toolbar/toolbar {:style styles/toolbar}
+  ([props action title options]
+   [toolbar/toolbar (utils/deep-merge {:style styles/toolbar}
+                                      props)
     [toolbar/nav-button action]
     [toolbar/content-title {:color :white}
      title]

src/status_im/ui/screens/wallet/components/styles.cljs

@@ -23,6 +23,13 @@
      :height         52
      :letter-spacing -0.2}))
 
+(def contact-code-text-input
+  {:text-align-vertical :top
+   :padding-top         16
+   :padding-left        2
+   :padding-right       8
+   :height              72})
+
 (defstyle label
   {:color   :white
    :ios     {:font-size      14

src/status_im/ui/screens/wallet/components/views.cljs

@@ -19,6 +19,7 @@
             [status-im.ui.screens.wallet.components.styles :as styles]
             [status-im.ui.screens.wallet.choose-recipient.views :as choose-recipient]
             [status-im.ui.screens.wallet.views :as wallet]
+            [status-im.ui.screens.wallet.styles :as wallet.styles]
             [status-im.ui.screens.wallet.utils :as wallet.utils]
             [status-im.utils.ethereum.core :as ethereum]
             [status-im.utils.ethereum.tokens :as tokens]
@@ -140,11 +141,14 @@
   (let [content (reagent/atom nil)]
     (fn []
       [components/simple-screen {:avoid-keyboard? true}
-       [components/toolbar (i18n/label :t/recipient)]
+       [components/toolbar {:style wallet.styles/toolbar-bottom-line}
+        components/default-action
+        (i18n/label :t/recipient)]
        [react/view components.styles/flex
         [components/cartouche {}
          (i18n/label :t/recipient)
          [components/text-input {:multiline      true
+                                 :style          styles/contact-code-text-input
                                  :placeholder    (i18n/label :t/recipient-code)
                                  :on-change-text #(reset! content %)}]]
         [bottom-buttons/bottom-button

src/status_im/ui/screens/wallet/request/views.cljs

@@ -66,7 +66,8 @@
   (views/letsubs [{:keys [address]} [:get-current-account]
                   chain-id          [:get-network-id]]
     [comp/simple-screen
-     [comp/toolbar comp/default-action
+     [comp/toolbar {}
+      comp/default-action
       (i18n/label :t/receive)
       [toolbar/actions [{:icon      :icons/share
                          :icon-opts {:color :white}

src/status_im/ui/screens/wallet/styles.cljs

@@ -8,6 +8,10 @@
 (def toolbar
   {:background-color colors/blue})
 
+(defstyle toolbar-bottom-line
+  {:ios {:border-bottom-width 1
+         :border-bottom-color colors/white-transparent}})
+
 (defn button-container [enabled?]
   (merge {:flex-direction :row
           :align-items    :center}