status-im/status-react
2
0
Fork 0
mirror of https://github.com/status-im/status-react.git synced 2025-01-11 11:34:45 +00:00
Code Issues Projects Releases Wiki Activity

fix #2119 - discover chat button formatting, hashtag color in status

Browse Source
This commit is contained in:
Goran Jovic 2017-10-15 14:29:43 +02:00 committed by Oskar Thorén
parent 9aa0b1b4b2
commit 8236302041
4 changed files with 37 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/status_im/components/status_view/view.cljs
View File

@ -4,11 +4,11 @@
[clojure.string :as str]
[status-im.components.react :refer [view text]]
[status-im.utils.platform :refer [platform-specific]]
[status-im.components.styles :refer [color-blue color-black]]
[status-im.components.styles :refer [color-blue color-black color-blue4-faded]]
[status-im.utils.utils :refer [hash-tag?]]))
(defn tag-view [tag]
[text {:style {:color color-blue}
[text {:style {:color color-blue4-faded}
:font :medium}
(str tag " ")])

1
src/status_im/components/styles.cljs
View File

@ -7,6 +7,7 @@
(def color-blue2 "#5b6dee")
(def color-blue3 "#424fae")
(def color-blue4 "#4360df")
(def color-blue4-faded "rgba(67,96,222,0.87)")
(def color-blue4-transparent "rgba(67, 96, 223, 0.10)")
(def color-blue5 "#3c56c8")
(def color-blue6 "#3745AF")

15
src/status_im/ui/screens/discover/components/views.cljs
View File

@ -38,6 +38,14 @@
(not (str/blank? photo-path)) photo-path
:else (identicon/identicon whisper-id)))
(defn chat-button [whisper-id]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:start-chat whisper-id])}
[react/view styles/chat-button-container
[react/view styles/chat-button-inner
[vector-icons/icon :icons/chats {:color :active}]
[react/text {:style styles/chat-button-text
:uppercase? (:uppercase? styles/chat-button-text-case)} (i18n/label :t/chat)]]]])
(defview discover-list-item [{:keys [message show-separator? current-account]}]
(letsubs [{contact-name :name
contact-photo-path :photo-path} [:get-in [:contacts/contacts (:whisper-id message)]]]
@ -56,16 +64,13 @@
[react/view styles/discover-list-item-avatar-container
[chat-icon/chat-icon
(display-image me? account-photo-path contact-photo-path photo-path whisper-id)
{:size 20}]]
{:size 24}]]
[react/text {:style styles/discover-list-item-name
:font :medium
:number-of-lines 1}
(display-name me? account-name contact-name name whisper-id)]]
(when-not me?
[react/touchable-highlight {:on-press #(re-frame/dispatch [:start-chat whisper-id])}
[react/view styles/popular-list-chat-action
[vector-icons/icon :icons/chats {:color "rgb(110, 0, 228)"}]
[react/text {:style styles/popular-list-chat-action-text} (i18n/label :t/chat)]]])]
(chat-button whisper-id))]
(when show-separator?
[react/view styles/separator])]])))

31
src/status_im/ui/screens/discover/styles.cljs
View File

@ -132,14 +132,31 @@
:margin-bottom 4
:margin-right 2}})
(def popular-list-chat-action
{:background-color styles/color-light-blue7
:flex-direction :row
:border-radius 5
:padding 4})
(defstyle chat-button-container
{:justify-content :center
:align-items :center
:background-color styles/color-blue4-transparent
:ios {:border-radius 8}
:android {:border-radius 4}})
(def popular-list-chat-action-text
{:color styles/color-dark-blue-4})
(defstyle chat-button-inner
{:flex-direction :row
:padding-top 7
:padding-left 7
:padding-right 8
:padding-bottom 5})
;; NOTE(goranjovic): Another hacky use of defstyle to get
;; platform specific styles in place where they belong
(defstyle chat-button-text-case
{:ios {:uppercase? false}
:android {:uppercase? true}})
(defstyle chat-button-text
{:color styles/color-blue4
:ios {:font-size 15}
:android {:font-size 14
:font-weight :bold}})
;; discover_recent