[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]
[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
(def toolbar-title-container
@ -37,7 +20,6 @@
(def toolbar-title-icon
(merge toolbar-icon {:opacity 0.4}))
;; Main section
(def main-section

View File

@ -65,9 +65,9 @@
(defn main-section [usd-value change syncing? error-message]
[react/view {:style styles/main-section}
(if syncing?
[wallet.views/wallet-syncing styles/error-container styles/error-message]
wallet.views/wallet-syncing
(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}
[react/text {:style styles/total-balance-value} usd-value]

View File

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

View File

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