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

fix: message content text alignment and spacing (#17606)

This commit is contained in:
codemaster 2023-11-08 07:40:26 -06:00 committed by GitHub
parent 569036c1d8
commit 742c451000
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 64 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/quo/components/messages/author/style.cljs
View File

@ -5,23 +5,22 @@
(def container
{:flex-wrap :nowrap
:flex-direction :row
:align-items :center})
:align-items :flex-end})
(defn middle-dot-nickname
(def name-container
{:margin-right 8
:flex-direction :row
:align-items :flex-end
})
(defn middle-dot
[theme]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)
:margin-horizontal 4})
:margin-horizontal 2})
(defn chat-key-text
[theme]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)
:margin-left 8
:padding-top 1})
(defn middle-dot-chat-key
[theme]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)
:margin-left 4})
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)})
(defn primary-name
[muted? theme]
@ -34,14 +33,13 @@
[theme]
{:padding-top 1
:flex-shrink 999999
:min-width 40
:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)})
(def icon-container
{:margin-left 4})
(defn icon-container
[is-first?]
{:margin-left (if is-first? 4 2)
:margin-bottom 2})
(defn time-text
[theme]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)
:padding-top 1
:margin-left 8})
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)})

80
src/quo/components/messages/author/view.cljs
View File

@ -14,46 +14,48 @@
muted? size theme]
:or {size 13}}]
[rn/view {:style (merge style/container style {:height (if (= size 15) 21.75 18.2)})}
[text/text
{:weight :semi-bold
:size (if (= size 15) :paragraph-1 :paragraph-2)
:number-of-lines 1
:accessibility-label :author-primary-name
:style (style/primary-name muted? theme)}
primary-name]
(when (not (string/blank? secondary-name))
[:<>
[text/text
{:size :label
:number-of-lines 1
:style (style/middle-dot-nickname theme)}
middle-dot]
[text/text
{:weight :medium
:size :label
:number-of-lines 1
:accessibility-label :author-secondary-name
:style (style/secondary-name theme)}
secondary-name]])
(when contact?
[icons/icon :main-icons2/contact
{:size 12
:no-color true
:container-style style/icon-container}])
(cond
verified?
[icons/icon :main-icons2/verified
{:size 12
:no-color true
:container-style style/icon-container}]
untrustworthy?
[icons/icon :main-icons2/untrustworthy
{:size 12
:no-color true
:container-style style/icon-container}])
[rn/view {:style style/name-container}
[text/text
{:weight :semi-bold
:size (if (= size 15) :paragraph-1 :paragraph-2)
:number-of-lines 1
:accessibility-label :author-primary-name
:style (style/primary-name muted? theme)}
primary-name]
(when (not (string/blank? secondary-name))
[:<>
[text/text
{:size :label
:number-of-lines 1
:style (style/middle-dot theme)}
middle-dot]
[text/text
{:weight :medium
:size :label
:number-of-lines 1
:accessibility-label :author-secondary-name
:style (style/secondary-name theme)}
secondary-name]])
(when contact?
[icons/icon :main-icons2/contact
{:size 12
:no-color true
:container-style (style/icon-container true)}])
(cond
verified?
[icons/icon :main-icons2/verified
{:size 12
:no-color true
:container-style (style/icon-container contact?)}]
untrustworthy?
[icons/icon :main-icons2/untrustworthy
{:size 12
:no-color true
:container-style (style/icon-container contact?)}])
]
(when (and (not verified?) short-chat-key)
[text/text
{:monospace true
{:weight :monospace
:size :label
:number-of-lines 1
:style (style/chat-key-text theme)}
@ -63,7 +65,7 @@
{:monospace true
:size :label
:number-of-lines 1
:style (style/middle-dot-chat-key theme)}
:style (style/middle-dot theme)}
middle-dot])
(when time-str
[text/text

2
src/status_im2/contexts/chat/messages/content/style.cljs
View File

@ -13,7 +13,7 @@
(assoc :background-color colors/primary-50-opa-5 :margin-bottom 4)
(and (not in-pinned-view?) (or mentioned pinned-by last-in-group?))
(assoc :margin-top 8))))
(assoc :margin-top 4))))
(defn user-message-content
[{:keys [first-in-group? outgoing outgoing-status]}]

3
src/status_im2/contexts/chat/messages/content/text/style.cljs
View File

@ -26,8 +26,7 @@
{:color (colors/theme-colors colors/primary-50
colors/primary-60)
:selection-color :transparent
:suppress-highlighting true
:line-height 21})
:suppress-highlighting true})
(defn code
[]

7
src/status_im2/contexts/chat/messages/content/text/view.cljs
View File

@ -104,10 +104,11 @@
(fn [acc e]
(render-inline acc e chat-id style-override mention-first))
[quo/text
{:style {:size :paragraph-1
:margin-bottom (if mention-first (if platform/ios? 4 0) 2)
{:size :paragraph-1
:style {:margin-bottom (if mention-first (if platform/ios? 4 0) 2)
:margin-top (if mention-first (if platform/ios? -4 0) -1)
:color (when (seq style-override) colors/white)}}]
:color (when (seq style-override) colors/white)
:line-height 22.75}}]
children)])
:edited-block

4
src/status_im2/contexts/chat/messages/navigation/view.cljs
View File

@ -81,8 +81,8 @@
(and (not composer-active?)
more-than-eight-messages?
(= :initial-render @big-name-visible?))
;; Keyboard height increasing is different between iOS and Android, That's why we have two
;; values.
;; Keyboard height increasing is different between iOS and Android, That's why we have
;; two values.
(and (if platform/ios? more-than-two-messages? more-than-four-messages?)
(< title-opacity-interpolation-start (reanimated/get-shared-value scroll-y))
composer-active?)