Merge pull request #327 from status-im/bug/#314
Updated profile view (#314)
Former-commit-id: 436ee19499
This commit is contained in:
commit
c371400f3d
|
@ -33,10 +33,10 @@
|
|||
:lineHeight 20})
|
||||
|
||||
(def chat-icon
|
||||
{:margin 4
|
||||
:borderRadius 20
|
||||
:width 40
|
||||
:height 40})
|
||||
{:margin 4
|
||||
:border-radius 20
|
||||
:width 40
|
||||
:height 40})
|
||||
|
||||
(def chat-icon-chat-list
|
||||
(merge chat-icon
|
||||
|
@ -45,8 +45,9 @@
|
|||
|
||||
(def chat-icon-menu-item
|
||||
(merge chat-icon
|
||||
{:width 24
|
||||
:height 24}))
|
||||
{:width 24
|
||||
:height 24
|
||||
:border-radius 12}))
|
||||
|
||||
(def chat-icon-profile
|
||||
(merge chat-icon
|
||||
|
@ -55,15 +56,15 @@
|
|||
:border-radius 32}))
|
||||
|
||||
(def online-view
|
||||
{:position :absolute
|
||||
:bottom 0
|
||||
:right 0
|
||||
:width 20
|
||||
:height 20
|
||||
:borderRadius 10
|
||||
:backgroundColor online-color
|
||||
:borderWidth 2
|
||||
:borderColor color-white})
|
||||
{:position :absolute
|
||||
:bottom 0
|
||||
:right 0
|
||||
:width 20
|
||||
:height 20
|
||||
:border-radius 10
|
||||
:background-color online-color
|
||||
:border-width 2
|
||||
:border-color color-white})
|
||||
|
||||
(def online-view-menu-item
|
||||
(merge online-view
|
||||
|
@ -78,21 +79,21 @@
|
|||
:border-radius 12}))
|
||||
|
||||
(def online-dot
|
||||
{:position :absolute
|
||||
:top 6
|
||||
:width 4
|
||||
:height 4
|
||||
:borderRadius 2
|
||||
:backgroundColor color-white})
|
||||
{:position :absolute
|
||||
:top 6
|
||||
:width 4
|
||||
:height 4
|
||||
:border-radius 2
|
||||
:background-color color-white})
|
||||
(def online-dot-left (merge online-dot {:left 3}))
|
||||
(def online-dot-right (merge online-dot {:left 9}))
|
||||
|
||||
(def photo-pencil
|
||||
{:margin-left 5
|
||||
{:margin-left 5
|
||||
:margin-right 5
|
||||
:margin-top 3
|
||||
:font-size 12
|
||||
:color :white})
|
||||
:margin-top 3
|
||||
:font-size 12
|
||||
:color :white})
|
||||
|
||||
(def online-dot-menu-item
|
||||
(merge online-dot
|
||||
|
|
|
@ -23,7 +23,6 @@
|
|||
new-status :status
|
||||
new-photo-path :photo-path}]
|
||||
(let [new-name (if (or (not new-name)
|
||||
(str/blank? new-name)
|
||||
(not (s/valid? ::v/name new-name)))
|
||||
name
|
||||
new-name)
|
||||
|
|
|
@ -52,6 +52,7 @@
|
|||
|
||||
(defn status-image-view [{{address :address
|
||||
username :name} :account
|
||||
{new-name :name} :profile-edit-data
|
||||
photo-path :photo-path
|
||||
status :status
|
||||
edit? :edit?}]
|
||||
|
@ -68,11 +69,16 @@
|
|||
[my-profile-icon {:account {:photo-path photo-path
|
||||
:name username}
|
||||
:edit? edit?}])]
|
||||
[text {:style st/username
|
||||
:font :default}
|
||||
(if (= username address)
|
||||
(label :t/user-anonymous)
|
||||
username)]
|
||||
[text-field
|
||||
{:line-color :white
|
||||
:focus-line-color :white
|
||||
:placeholder (label :t/user-anonymous)
|
||||
:editable edit?
|
||||
:input-style (st/username-input edit? (s/valid? ::v/name (or new-name username)))
|
||||
:wrapper-style st/username-wrapper
|
||||
:value (if (not= username address)
|
||||
username)
|
||||
:on-change-text #(dispatch [:set-in [:profile-edit :name] %])}]
|
||||
[text-input {:style st/status-input
|
||||
:maxLength 140
|
||||
:editable edit?
|
||||
|
@ -119,17 +125,6 @@
|
|||
[icon :more_vertical_blue st/more-btn-image]]]]]
|
||||
|
||||
[scroll-view st/profile-properties-container
|
||||
[text-field
|
||||
{:editable false
|
||||
:input-style st/profile-input-text
|
||||
:wrapper-style st/profile-input-wrapper
|
||||
:value (if (and (not= username address)
|
||||
username
|
||||
(not (str/blank? username)))
|
||||
username
|
||||
(label :t/not-specified))
|
||||
:label (label :t/username)}]
|
||||
|
||||
[text-field
|
||||
{:editable false
|
||||
:input-style st/profile-input-text
|
||||
|
@ -175,26 +170,13 @@
|
|||
:profile-edit-data profile-edit-data
|
||||
:edit? edit?}]
|
||||
|
||||
[status-image-view {:account account
|
||||
:photo-path (or new-photo-path photo-path)
|
||||
:status (or new-status status)
|
||||
:edit? edit?}]
|
||||
[status-image-view {:account account
|
||||
:profile-edit-data profile-edit-data
|
||||
:photo-path (or new-photo-path photo-path)
|
||||
:status (or new-status status)
|
||||
:edit? edit?}]
|
||||
|
||||
[scroll-view st/profile-properties-container
|
||||
[text-field
|
||||
{:error (if-not (s/valid? ::v/name new-name)
|
||||
(label :t/error-incorrect-name))
|
||||
:error-color "#7099e6"
|
||||
:editable edit?
|
||||
:input-style (if edit?
|
||||
st/profile-input-text
|
||||
st/profile-input-text-non-editable)
|
||||
:wrapper-style st/profile-input-wrapper
|
||||
:value (if (not= username address)
|
||||
username)
|
||||
:label (label :t/username)
|
||||
:on-change-text #(dispatch [:set-in [:profile-edit :name] %])}]
|
||||
|
||||
[text-field
|
||||
{:editable false
|
||||
:input-style st/profile-input-text-non-editable
|
||||
|
|
|
@ -10,7 +10,8 @@
|
|||
separator-color
|
||||
text1-color
|
||||
text1-disabled-color
|
||||
text2-color]]))
|
||||
text2-color
|
||||
color-red]]))
|
||||
|
||||
(def profile
|
||||
{:flex 1
|
||||
|
@ -51,18 +52,17 @@
|
|||
(def user-photo-container
|
||||
{:margin-top 22})
|
||||
|
||||
(def username
|
||||
{:margin-top 12
|
||||
:font-size 18
|
||||
:color text1-color})
|
||||
(def username-wrapper
|
||||
{:width 300
|
||||
:margin-top -22
|
||||
:margin-bottom -16})
|
||||
|
||||
(def username-input
|
||||
{:align-self "stretch"
|
||||
:margin-top -8
|
||||
:margin-bottom -22
|
||||
:font-size 18
|
||||
:text-align :center
|
||||
:color text1-color})
|
||||
(defn username-input [edit? valid?]
|
||||
{:font-size 18
|
||||
:text-align :center
|
||||
:color (if edit?
|
||||
(if valid? text1-color color-red)
|
||||
text1-disabled-color)})
|
||||
|
||||
(def status-block
|
||||
{:flex-direction "column"
|
||||
|
|
Loading…
Reference in New Issue