Chat messages layout fixes

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>
This commit is contained in:
Dmitry Novotochinov 2018-06-25 15:48:53 +03:00 committed by Julien Eluard
parent 2423d7c244
commit d724a12d51
No known key found for this signature in database
GPG Key ID: 6FD7DB5437FCBEF6
3 changed files with 22 additions and 22 deletions

View File

@ -1,4 +1,5 @@
(ns status-im.chat.styles.message.datemark (ns status-im.chat.styles.message.datemark
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.styles :as common])) (:require [status-im.ui.components.styles :as common]))
(def datemark-wrapper (def datemark-wrapper
@ -9,7 +10,7 @@
{:margin-top 16 {:margin-top 16
:height 22}) :height 22})
(def datemark-text (defstyle datemark-text
{:color common/color-gray4 {:color common/color-gray4
:letter-spacing -0.2 :ios {:letter-spacing -0.2}
:font-size 15}) :font-size 15})

View File

@ -10,7 +10,7 @@
:color styles/text1-color :color styles/text1-color
:letter-spacing -0.2 :letter-spacing -0.2
:android {:line-height 22} :android {:line-height 22}
:ios {:line-height 23}}) :ios {:line-height 22}})
(def style-sub-text (def style-sub-text
{:top -2 {:top -2
@ -23,31 +23,29 @@
[{:keys [first-in-group? display-username?]}] [{:keys [first-in-group? display-username?]}]
(if (and display-username? (if (and display-username?
first-in-group?) first-in-group?)
8 6
4)) 2))
(def message-empty-spacing (def message-empty-spacing
{:height 16}) {:height 16})
(def message-body-base
{:padding-right 10
:padding-left 10})
(defn last-message-padding (defn last-message-padding
[{:keys [last? typing]}] [{:keys [last? typing]}]
(when (and last? (not typing)) (when (and last? (not typing))
{:padding-bottom 16})) {:padding-bottom 16}))
(defn message-body (defn message-body
[{:keys [outgoing] :as message}] [{:keys [outgoing display-photo?] :as message}]
(let [align (if outgoing :flex-end :flex-start) (let [align (if outgoing :flex-end :flex-start)
direction (if outgoing :row-reverse :row)] direction (if outgoing :row-reverse :row)]
(merge message-body-base (merge {:flex-direction direction
{:flex-direction direction
:width 230 :width 230
:padding-top (message-padding-top message) :padding-top (message-padding-top message)
:align-self align :align-self align
:align-items align}))) :align-items align}
(when display-photo?
{:padding-right 8
:padding-left 8}))))
(def message-timestamp (def message-timestamp
{:font-size 10 {:font-size 10
@ -89,17 +87,17 @@
[outgoing] [outgoing]
(let [align (if outgoing :flex-end :flex-start)] (let [align (if outgoing :flex-end :flex-start)]
{:flex-direction :column {:flex-direction :column
:width 260 :width 230
:padding-left 10 :padding-left 8
:padding-right 10 :padding-right 8
:align-items align})) :align-items align}))
(defn delivery-status [outgoing] (defn delivery-status [outgoing]
(if outgoing (if outgoing
{:align-self :flex-end {:align-self :flex-end
:padding-right 22} :padding-right 8}
{:align-self :flex-start {:align-self :flex-start
:padding-left 16})) :padding-left 8}))
(def message-author (def message-author
{:width photos/default-size {:width photos/default-size

View File

@ -79,6 +79,7 @@
(letsubs [network [:network-name]] (letsubs [network [:network-name]]
(let [{{:keys [amount fiat-amount tx-hash asset] send-network :network} :params} content (let [{{:keys [amount fiat-amount tx-hash asset] send-network :network} :params} content
recipient-name (get-in content [:params :bot-db :public :recipient]) recipient-name (get-in content [:params :bot-db :public :recipient])
amount-text-long? (< 10 (count amount))
network-mismatch? (and (seq send-network) (not= network send-network))] network-mismatch? (and (seq send-network) (not= network send-network))]
[react/view style/command-send-message-view [react/view style/command-send-message-view
[react/view [react/view
@ -88,7 +89,7 @@
:font :medium} :font :medium}
amount amount
[react/text {:style (style/command-amount-currency-separator outgoing)} [react/text {:style (style/command-amount-currency-separator outgoing)}
"."] (if amount-text-long? "\n" ".")]
[react/text {:style (style/command-send-currency-text outgoing) [react/text {:style (style/command-send-currency-text outgoing)
:font :default} :font :default}
asset]]]] asset]]]]