status-im
/
status-mobile
mirror of https://github.com/status-im/status-mobile.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

improved new chat UI

This commit is contained in:
Andrey Shovkoplyas 2018-05-31 11:19:47 +03:00 committed by Roman Volosovskyi
parent 0d0c37e4a9
commit 2eccca9898
No known key found for this signature in database
GPG Key ID: 0238A4B5ECEE70DE
3 changed files with 36 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/status_im/ui/screens/add_new/new_chat/views.cljs
View File

@ -24,25 +24,27 @@
[react/keyboard-avoiding-view open-dapp.styles/main-container [react/keyboard-avoiding-view open-dapp.styles/main-container
[status-bar/status-bar] [status-bar/status-bar]
[toolbar.view/simple-toolbar (i18n/label :t/new-chat)] [toolbar.view/simple-toolbar (i18n/label :t/new-chat)]
[react/view add-new.styles/input-container [react/view add-new.styles/new-chat-container
[react/text-input {:on-change-text #(re-frame/dispatch [:set :contacts/new-identity %]) [react/view add-new.styles/new-chat-input-container
:on-submit-editing #(when-not error-message [react/text-input {:on-change-text #(re-frame/dispatch [:set :contacts/new-identity %])
(re-frame/dispatch [:add-contact-handler])) :on-submit-editing #(when-not error-message
:placeholder (i18n/label :t/enter-contact-code) (re-frame/dispatch [:add-contact-handler]))
:style add-new.styles/input :placeholder (i18n/label :t/enter-contact-code)
:accessibility-label :enter-contact-code-input :style add-new.styles/input
:return-key-type :go}] :accessibility-label :enter-contact-code-input
:return-key-type :go}]]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:scan-qr-code [react/touchable-highlight {:on-press #(re-frame/dispatch [:scan-qr-code
{:toolbar-title (i18n/label :t/new-contact)} {:toolbar-title (i18n/label :t/new-contact)}
:set-contact-identity-from-qr]) :set-contact-identity-from-qr])
:style {:margin-right 14} :style add-new.styles/button-container
:accessibility-label :scan-contact-code-button} :accessibility-label :scan-contact-code-button}
[react/view [react/view
[vector-icons/icon :icons/qr {:color colors/blue}]]]] [vector-icons/icon :icons/qr {:color colors/blue}]]]]
[react/text {:style styles/error-message} [react/text {:style styles/error-message}
error-message] error-message]
[react/text {:style open-dapp.styles/list-title} (when (seq contacts)
(i18n/label :t/contacts)] [react/text {:style open-dapp.styles/list-title}
(i18n/label :t/contacts)])
[list/flat-list {:data contacts [list/flat-list {:data contacts
:key-fn :address :key-fn :address
:render-fn render-row :render-fn render-row

3
src/status_im/ui/screens/add_new/new_public_chat/styles.cljs
View File

@ -42,7 +42,8 @@
:color colors/white}) :color colors/white})
(def input-container (def input-container
{:padding-left 0 {:padding 0
:padding-right 16
:background-color nil}) :background-color nil})
(def tooltip (def tooltip

21
src/status_im/ui/screens/add_new/styles.cljs
View File

@ -3,6 +3,10 @@
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles])) [status-im.ui.components.styles :as styles]))
(def new-chat-container
{:flex-direction :row
:align-items :center})
(def input-container (def input-container
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
@ -12,6 +16,23 @@
:margin-horizontal 14 :margin-horizontal 14
:margin-top 24}) :margin-top 24})
(def new-chat-input-container
(merge
input-container
{:flex 1
:margin-horizontal 0
:margin-left 14}))
(def button-container
{:justify-content :center
:border-radius styles/border-radius
:height 52
:background-color colors/gray-lighter
:padding-horizontal 15
:margin-right 14
:margin-left 3
:margin-top 24})
(defstyle input (defstyle input
{:flex 1 {:flex 1
:font-size 15 :font-size 15