[BUG #2251] Added proper margin around warning text

This commit is contained in:
Julien Eluard 2017-10-23 09:42:00 +02:00 committed by Roman Volosovskyi
parent 95d2a6b1ee
commit e80db63ede
4 changed files with 29 additions and 37 deletions

View File

@ -3,23 +3,6 @@
(:require [status-im.components.styles :as styles] (:require [status-im.components.styles :as styles]
[status-im.utils.platform :as platform])) [status-im.utils.platform :as platform]))
;; Errors
(defstyle error-container
{:align-self :center
:justify-content :center
:ios {:border-radius 20
:margin-top 6}
:android {:border-radius 4
:margin-top 18}
:background-color styles/color-blue5})
(def error-message
{:color styles/color-white
:padding-right 10
:font-size 13})
;; Toolbar ;; Toolbar
(def toolbar-title-container (def toolbar-title-container
@ -37,7 +20,6 @@
(def toolbar-title-icon (def toolbar-title-icon
(merge toolbar-icon {:opacity 0.4})) (merge toolbar-icon {:opacity 0.4}))
;; Main section ;; Main section
(def main-section (def main-section

View File

@ -65,9 +65,9 @@
(defn main-section [usd-value change syncing? error-message] (defn main-section [usd-value change syncing? error-message]
[react/view {:style styles/main-section} [react/view {:style styles/main-section}
(if syncing? (if syncing?
[wallet.views/wallet-syncing styles/error-container styles/error-message] wallet.views/wallet-syncing
(when error-message (when error-message
[wallet.views/error-message-view styles/error-container styles/error-message])) wallet.views/error-message-view))
[react/view {:style styles/total-balance-container} [react/view {:style styles/total-balance-container}
[react/view {:style styles/total-balance} [react/view {:style styles/total-balance}
[react/text {:style styles/total-balance-value} usd-value] [react/text {:style styles/total-balance-value} usd-value]

View File

@ -5,21 +5,32 @@
;; errors ;; errors
(defstyle error-container (defstyle error-container
{:align-self :center
:justify-content :center
:ios {:border-radius 20
:margin-top 6}
:android {:border-radius 4
:margin-top 18}
:background-color styles/color-blue5})
(defstyle error-message-container
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
:ios {:padding-top 8 :padding-horizontal 15
:padding-bottom 8} :ios {:padding-vertical 8}
:android {:padding-top 10 :android {:padding-vertical 10}})
:padding-bottom 10}})
(defnstyle exclamation [color] (defnstyle exclamation [color]
{:background-color color {:background-color color
:border-radius 100 :border-radius 100
:width 16 :width 16
:height 16 :height 16
:margin-left 12 :margin-right 6})
:margin-right 6
:margin-top 2}) (def error-message
{:color styles/color-white
:font-size 13})
(def error-exclamation (def error-exclamation
(exclamation styles/color-red-2)) (exclamation styles/color-red-2))

View File

@ -4,15 +4,14 @@
[status-im.components.icons.vector-icons :as vector-icons] [status-im.components.icons.vector-icons :as vector-icons]
[status-im.i18n :as i18n])) [status-im.i18n :as i18n]))
(defn message-view [error-container-style error-message-style icon-container-style label] (defn- message-view [icon-container-style label]
[react/view {:style error-container-style}
[react/view {:style styles/error-container} [react/view {:style styles/error-container}
[react/view {:style styles/error-message-container}
[vector-icons/icon :icons/exclamation_mark {:color :white [vector-icons/icon :icons/exclamation_mark {:color :white
:container-style icon-container-style}] :container-style icon-container-style}]
[react/text {:style error-message-style} label]]]) [react/text {:style styles/error-message}
label]]])
(defn error-message-view [error-container-style error-message-style] (def error-message-view [message-view styles/error-exclamation (i18n/label :t/wallet-error)])
[message-view error-container-style error-message-style styles/error-exclamation (i18n/label :t/wallet-error)])
(defn wallet-syncing [error-container-style error-message-style] (def wallet-syncing [message-view styles/warning-exclamation (i18n/label :t/sync-in-progress)])
[message-view error-container-style error-message-style styles/warning-exclamation (i18n/label :t/sync-in-progress)])