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

fixes for https://github.com/status-im/status-react/issues/911 and https://github.com/status-im/status-react/issues/834

This commit is contained in:
Andrey Shovkoplyas 2017-03-20 18:12:40 +03:00 committed by Roman Volosovskyi
parent 514f6a6be1
commit a543cdfa26
13 changed files with 126 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/status_im/android/platform.cljs
View File

@ -19,7 +19,7 @@
:bar-style "light-content" :bar-style "light-content"
:color styles/color-black}} :color styles/color-black}}
:toolbar-new {:height 55 :toolbar-new {:height 55
:padding-top 18 :padding-top 15
:padding-left 16 :padding-left 16
:padding-right 16} :padding-right 16}
:toolbar-title-container {:padding-left 30} :toolbar-title-container {:padding-left 30}

4
src/status_im/components/context_menu.cljs
View File

@ -34,7 +34,7 @@
(handler))))}) (handler))))})
nil) nil)
(defn context-menu [trigger options] (defn context-menu [trigger options & [customStyles]]
(if ios? (if ios?
[touchable-highlight [touchable-highlight
{:on-press #(open-ios-menu options)} {:on-press #(open-ios-menu options)}
@ -42,7 +42,7 @@
trigger]] trigger]]
[menu {:onSelect #(when % (do (%) nil))} [menu {:onSelect #(when % (do (%) nil))}
[menu-trigger trigger] [menu-trigger trigger]
[menu-options st/context-menu-options [menu-options (st/context-menu-options customStyles)
(for [{:keys [style value destructive?] :as option} options] (for [{:keys [style value destructive?] :as option} options]
^{:key option} ^{:key option}
[menu-option {:value value} [menu-option {:value value}

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

@ -98,16 +98,20 @@
:align-items :center :align-items :center
:background-color color-light-blue}) :background-color color-light-blue})
(def context-menu-options (defn context-menu-options [custom-styles]
{:customStyles {:optionsContainer {:elevation 2 {:customStyles {:optionsContainer
:margin-top 30 (merge {:elevation 2
:padding-top 8 :margin-top 30
:width 164 :padding-top 8
:padding-bottom 8} :width 164
:optionWrapper {:padding-left 16 :padding-bottom 8}
:padding-right 16 (:optionsContainer custom-styles))
:justify-content :center :optionWrapper
:height 48}}}) (merge {:padding-left 16
:padding-right 16
:justify-content :center
:height 48}
(:optionWrapper custom-styles))}})
(defn context-menu-text [destructive?] (defn context-menu-text [destructive?]
{:font-size 15 {:font-size 15

25
src/status_im/components/toolbar_new/styles.cljs
View File

@ -1,9 +1,10 @@
(ns status-im.components.toolbar-new.styles (ns status-im.components.toolbar-new.styles
(:require-macros [status-im.utils.styles :refer [defnstyle]]) (:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.components.styles :refer [text1-color (:require [status-im.components.styles :refer [text1-color
color-white color-white
color-light-gray color-light-gray
color-gray5 color-gray5
color-gray4
color-blue color-blue
color-black]] color-black]]
[status-im.utils.platform :as p])) [status-im.utils.platform :as p]))
@ -37,10 +38,11 @@
{:flex 1 {:flex 1
:align-self :stretch})) :align-self :stretch}))
(def toolbar-title-text (defstyle toolbar-title-text
{:color text1-color {:color text1-color
:letter-spacing -0.2 :letter-spacing -0.2
:font-size 17}) :font-size 17
:ios {:padding-top 2}})
(def toolbar-border-container (def toolbar-border-container
(get-in p/platform-specific [:component-styles :toolbar-border-container])) (get-in p/platform-specific [:component-styles :toolbar-border-container]))
@ -68,13 +70,16 @@
{:flex 1})) {:flex 1}))
(def toolbar-search-input (def toolbar-search-input
(merge (get-in p/platform-specific [:component-styles :toolbar-search-input]) (merge {:line-height 24
{:flex 1 :height 24
:padding-bottom 10 :font-size 17
:font-size 17 :padding-top 0
:padding-top 0 :padding-left 0
:align-self :stretch :padding-bottom 0
:color color-black})) :text-align-vertical :center
:color color-black}
(get-in p/platform-specific [:component-styles :toolbar-search-input])))
(def action-default (def action-default
{:width 24 {:width 24

18
src/status_im/components/toolbar_new/view.cljs
View File

@ -8,7 +8,8 @@
touchable-highlight]] touchable-highlight]]
[status-im.components.sync-state.gradient :refer [sync-state-gradient-view]] [status-im.components.sync-state.gradient :refer [sync-state-gradient-view]]
[status-im.components.styles :refer [icon-default [status-im.components.styles :refer [icon-default
icon-search]] icon-search
color-gray4]]
[status-im.components.context-menu :refer [context-menu]] [status-im.components.context-menu :refer [context-menu]]
[status-im.components.toolbar-new.actions :as act] [status-im.components.toolbar-new.actions :as act]
[status-im.components.toolbar-new.styles :as st] [status-im.components.toolbar-new.styles :as st]
@ -83,13 +84,14 @@
[view st/toolbar-with-search-content [view st/toolbar-with-search-content
(if show-search? (if show-search?
[text-input [text-input
{:style st/toolbar-search-input {:style st/toolbar-search-input
:ref #(reset! search-text-input %) :ref #(reset! search-text-input %)
:auto-focus true :auto-focus true
:placeholder search-placeholder :placeholder search-placeholder
:on-change-text #(dispatch [:set-in [:toolbar-search :text] %]) :placeholder-text-color color-gray4
:on-submit-editing (when on-search-submit :on-change-text #(dispatch [:set-in [:toolbar-search :text] %])
#(toolbar-search-submit on-search-submit))}] :on-submit-editing (when on-search-submit
#(toolbar-search-submit on-search-submit))}]
(or custom-title (or custom-title
[view [view
[text {:style st/toolbar-title-text [text {:style st/toolbar-title-text

6
src/status_im/contacts/screen.cljs
View File

@ -92,9 +92,9 @@
:extended? edit? :extended? edit?
:on-click (when-not edit? click-handler) :on-click (when-not edit? click-handler)
:extend-options (when group :extend-options (when group
[{:value #(dispatch [:hide-contact contact]) [{:value #(dispatch [:hide-contact contact])
:text (label :t/delete-contact) :text (label :t/delete-contact)
:style st/delete-contact-text} :destructive? true}
{:value #(dispatch [:remove-contact-from-group {:value #(dispatch [:remove-contact-from-group
(:whisper-identity contact) (:whisper-identity contact)
(:group-id group)]) (:group-id group)])

3
src/status_im/contacts/styles.cljs
View File

@ -193,6 +193,3 @@
:background-color color-white :background-color color-white
:align-items :center :align-items :center
:justify-content :center}) :justify-content :center})
(def delete-contact-text
{:color color-light-red})

5
src/status_im/contacts/views/contact.cljs
View File

@ -18,8 +18,9 @@
[text {:style st/letter-text} letter])]) [text {:style st/letter-text} letter])])
(defn options-btn [contact more-options] (defn options-btn [contact more-options]
(let [options [{:value #(dispatch [:hide-contact contact]) :text (label :t/delete-contact) (let [options [{:value #(dispatch [:hide-contact contact])
:style st/delete-contact-text}]] :text (label :t/delete-contact)
:destructive? true}]]
[view st/more-btn [view st/more-btn
[context-menu [context-menu
[icon :options_gray] [icon :options_gray]

5
src/status_im/contacts/views/contact_list.cljs
View File

@ -28,8 +28,9 @@
[contact-view {:contact row [contact-view {:contact row
:extended? edit? :extended? edit?
:extend-options (when group :extend-options (when group
[{:value #(dispatch [:hide-contact row]) [{:value #(dispatch [:hide-contact row])
:text (label :t/delete-contact)} :text (label :t/delete-contact)
:destructive? true}
{:value #(dispatch [:remove-contact-from-group {:value #(dispatch [:remove-contact-from-group
(:whisper-identity row) (:whisper-identity row)
(:group-id group)]) (:group-id group)])

6
src/status_im/ios/platform.cljs
View File

@ -19,7 +19,7 @@
:toolbar {:border-bottom-color styles/color-gray3 :toolbar {:border-bottom-color styles/color-gray3
:border-bottom-width 0.5} :border-bottom-width 0.5}
:toolbar-new {:height 56 :toolbar-new {:height 56
:padding-top 20 :padding-top 18
:padding-left 16 :padding-left 16
:padding-right 16} :padding-right 16}
:toolbar-title-container {:align-items :center} :toolbar-title-container {:align-items :center}
@ -167,7 +167,9 @@
:bottom-gradient {:height 1} :bottom-gradient {:height 1}
:input-label {:left 0} :input-label {:left 0}
:input-error-text {:margin-left 0} :input-error-text {:margin-left 0}
:toolbar-search-input {:padding-left 10} :toolbar-search-input {:padding-left 8
:padding-top 2
:letter-spacing -0.2}
:toolbar-nav-action {:width 46 :toolbar-nav-action {:width 46
:height 56 :height 56
:align-items :center :align-items :center

3
src/status_im/profile/edit/screen.cljs
View File

@ -48,7 +48,8 @@
[context-menu [context-menu
[my-profile-icon {:account contact [my-profile-icon {:account contact
:edit? true}] :edit? true}]
profile-icon-options]] profile-icon-options
st/context-menu-custom-styles]]
[view st/edit-profile-name-container [view st/edit-profile-name-container
[text {:style st/edit-name-title} [text {:style st/edit-name-title}
(label :t/name)] (label :t/name)]

89
src/status_im/profile/screen.cljs
View File

@ -80,15 +80,17 @@
:arrow_right_blue :arrow_right_blue
#(dispatch [:open-chat-with-the-send-transaction chat-id])]]) #(dispatch [:open-chat-with-the-send-transaction chat-id])]])
(defn profile-info-item [label value options text-mode] (defn profile-info-item [{:keys [label value options text-mode empty-value?]}]
[view st/profile-setting-item [view st/profile-setting-item
[view st/profile-setting-text-container [view (st/profile-setting-text-container options)
[text {:style st/profile-setting-title} [text {:style st/profile-setting-title}
label] label]
[view st/profile-setting-spacing] [view st/profile-setting-spacing]
[text {:style st/profile-setting-text [text {:style (if empty-value?
:numberOfLines 1 st/profile-setting-text-empty
:ellipsizeMode text-mode} st/profile-setting-text)
:number-of-lines 1
:ellipsizeMode text-mode}
value]] value]]
(when options (when options
[context-menu [context-menu
@ -101,23 +103,23 @@
(defn profile-info-address-item [{:keys [address] :as contact}] (defn profile-info-address-item [{:keys [address] :as contact}]
[profile-info-item [profile-info-item
(label :t/address) {:label (label :t/address)
address :value address
(into [] :options (into []
(concat [{:value (show-qr contact :address) (concat [{:value (show-qr contact :address)
:text (label :t/show-qr)}] :text (label :t/show-qr)}]
(share-options address))) (share-options address)))
:middle]) :text-mode :middle}])
(defn profile-info-public-key-item [public-key contact] (defn profile-info-public-key-item [public-key contact]
[profile-info-item [profile-info-item
(label :t/public-key) {:label (label :t/public-key)
public-key :value public-key
(into [] :options (into []
(concat [{:value (show-qr contact :public-key) (concat [{:value (show-qr contact :public-key)
:text (label :t/show-qr)}] :text (label :t/show-qr)}]
(share-options public-key))) (share-options public-key)))
:middle]) :text-mode :middle}])
(defn info-item-separator [] (defn info-item-separator []
[separator st/info-item-separator]) [separator st/info-item-separator])
@ -135,25 +137,44 @@
^{:key (str "item-" i)} ^{:key (str "item-" i)}
(str status " ")))) (str status " "))))
(defn profile-info-status-item [status & [options]]
(let [status-empty? (= "" status)
status-text (if status-empty?
(label :t/profile-no-status)
(colorize-status-hashtags status))]
[profile-info-item {:label (label :t/status)
:value status-text
:options options
:empty-value? status-empty?}]))
(defn profile-info-phone-item [phone & [options]]
(let [phone-empty? (or (nil? phone) (= "" phone))
phone-text (if phone-empty?
(label :t/not-specified)
phone)]
[profile-info-item {:label (label :t/phone-number)
:value phone-text
:options options
:empty-value? phone-empty?}]))
(defn profile-info [{:keys [whisper-identity :whisper-identity (defn profile-info [{:keys [whisper-identity :whisper-identity
status :status status :status
phone :phone] :as contact}] phone :phone] :as contact}]
[view [view
[profile-info-item (label :t/status) (colorize-status-hashtags status)] [profile-info-status-item status]
[info-item-separator] [info-item-separator]
[profile-info-address-item contact] [profile-info-address-item contact]
[info-item-separator] [info-item-separator]
[profile-info-public-key-item whisper-identity contact] [profile-info-public-key-item whisper-identity contact]
[info-item-separator] [info-item-separator]
[profile-info-item (label :t/phone-number) phone]]) [profile-info-phone-item phone]])
(defn my-profile-info [{:keys [public-key :public-key (defn my-profile-info [{:keys [public-key :public-key
status :status status :status
phone :phone] :as contact}] phone :phone] :as contact}]
[view [view st/my-profile-info-container
[profile-info-item [profile-info-status-item
(label :t/status) status
(colorize-status-hashtags status)
[{:value #(dispatch [:open-edit-my-profile]) [{:value #(dispatch [:open-edit-my-profile])
:text (label :t/edit)}]] :text (label :t/edit)}]]
[info-item-separator] [info-item-separator]
@ -161,8 +182,10 @@
[info-item-separator] [info-item-separator]
[profile-info-public-key-item public-key contact] [profile-info-public-key-item public-key contact]
[info-item-separator] [info-item-separator]
[profile-info-item (label :t/phone-number) phone [{:value #(dispatch [:phone-number-change-requested]) [profile-info-phone-item
:text (label :t/edit)}]]]) phone
[{:value #(dispatch [:phone-number-change-requested])
:text (label :t/edit)}]]])
(defview my-profile [] (defview my-profile []
[current-account [:get-current-account]] [current-account [:get-current-account]]

15
src/status_im/profile/styles.cljs
View File

@ -38,6 +38,10 @@
{:android {:padding-top 8 {:android {:padding-top 8
:padding-bottom 8}}) :padding-bottom 8}})
(defstyle my-profile-info-container
{:android {:padding-top 8
:padding-bottom 8}})
(def profile-bage (def profile-bage
(merge (ps-profile :profile-bage) (merge (ps-profile :profile-bage)
{:align-items :center})) {:align-items :center}))
@ -48,6 +52,9 @@
:padding-left 24 :padding-left 24
:padding-top 25}) :padding-top 25})
(def context-menu-custom-styles
{:optionsContainer {:margin-top 78}})
(def profile-name-container (def profile-name-container
{:margin-top 12}) {:margin-top 12})
@ -80,9 +87,9 @@
{:flex-direction :row {:flex-direction :row
:align-items :center})) :align-items :center}))
(def profile-setting-text-container (defn profile-setting-text-container [options]
{:flex 1 {:flex 1
:padding-right 20}) :padding-right (if options 16 40)})
(def profile-setting-title (def profile-setting-title
(merge (ps-profile :profile-setting-title) (merge (ps-profile :profile-setting-title)
@ -91,6 +98,10 @@
(def profile-setting-text (def profile-setting-text
(ps-profile :profile-setting-text)) (ps-profile :profile-setting-text))
(def profile-setting-text-empty
(merge profile-setting-text
{:color color-gray4}))
(def profile-setting-spacing (def profile-setting-spacing
(ps-profile :profile-setting-spacing)) (ps-profile :profile-setting-spacing))