[design] remove letter-spacing property

Signed-off-by: yenda <eric@status.im>
2019-03-11 23:56:52 +01:00 · 2019-03-11 23:56:52 +01:00 · 670deb1f4c
parent d32f81bbff
commit 670deb1f4c
45 changed files with 281 additions and 435 deletions
--- a/src/status_im/chat/commands/impl/transactions/styles.cljs
+++ b/src/status_im/chat/commands/impl/transactions/styles.cljs
@ -69,10 +69,10 @@
   :align-items    :flex-end
   :max-width      250})

-(defnstyle command-send-amount-text [outgoing]
-  {:font-size   22
-   :color       (if outgoing colors/white colors/blue)
-   :ios         {:letter-spacing -0.5}})
+(defn command-send-amount-text
+  [outgoing]
+  {:font-size 22
+   :color     (if outgoing colors/white colors/blue)})

 (def command-send-currency
  {:flex-direction :column
@ -83,15 +83,13 @@
   :color   (if outgoing colors/blue colors/blue-light)})

 (defn command-send-currency-text [outgoing]
-  {:font-size      22
-   :margin-left    4
-   :letter-spacing 1
-   :color          (if outgoing colors/white-transparent colors/gray)})
+  {:font-size   22
+   :margin-left 4
+   :color       (if outgoing colors/white-transparent colors/gray)})

 (defn command-request-currency-text [outgoing]
-  {:font-size      22
-   :letter-spacing 1
-   :color          (if outgoing colors/wild-blue-yonder colors/gray)})
+  {:font-size 22
+   :color     (if outgoing colors/wild-blue-yonder colors/gray)})

 (defn command-request-timestamp-text [outgoing]
  {:font-size 12
@ -152,10 +150,9 @@
  {:flex-direction :row
   :margin-top     6})

-(defnstyle command-request-amount-text [outgoing]
-  {:font-size   22
-   :ios         {:letter-spacing -0.5}
-   :color       (if outgoing colors/white colors/black)})
+(defn command-request-amount-text [outgoing]
+  {:font-size 22
+   :color     (if outgoing colors/white colors/black)})

 (def command-request-separator-line
  {:background-color colors/gray-light
@ -188,4 +185,3 @@

 (def command-request-timestamp-row
  {:margin-top 6})
-
--- a/src/status_im/ui/components/action_button/styles.cljs
+++ b/src/status_im/ui/components/action_button/styles.cljs
@ -23,9 +23,8 @@
  {:padding-left 16})

 (def action-button-label
-  {:color          colors/blue
-   :letter-spacing -0.2
-   :font-size      16})
+  {:color     colors/blue
+   :font-size 16})

 (defstyle actions-list
  {:background-color colors/white
@ -43,4 +42,3 @@
   :align-items      :center
   :justify-content  :center
   :background-color colors/gray-lighter})
-
--- a/src/status_im/ui/components/button/styles.cljs
+++ b/src/status_im/ui/components/button/styles.cljs
@ -38,19 +38,12 @@
  (merge {:border-color border-color}
         (border position)))

-(defstyle button-text
+(def button-text
  {:font-weight        :normal
   :color              colors/white
   :padding-horizontal 16
-   :desktop            {:font-size        14
-                        :padding-vertical 10
-                        :letter-spacing   0.5}
-   :android            {:font-size        14
-                        :padding-vertical 10
-                        :letter-spacing   0.5}
-   :ios                {:font-size        15
-                        :padding-vertical 9
-                        :letter-spacing   -0.2}})
+   :font-size          15
+   :padding-vertical   10})

 (defstyle button-text-disabled
  {:android {:opacity 0.4}
--- a/src/status_im/ui/components/common/common.cljs
+++ b/src/status_im/ui/components/common/common.cljs
@ -60,10 +60,9 @@
             (i18n/label :t/mainnet-text))]]]))

 (defn logo
-  ([] (logo nil))
-  ([{:keys [size icon-size shadow?] :or {shadow? true}}]
-   [react/view {:style (styles/logo-container size shadow?)}
-    [vector-icons/icon :icons/logo (styles/logo icon-size)]]))
+  [{:keys [size icon-size]}]
+  [react/view {:style (styles/logo-container size)}
+   [vector-icons/icon :icons/logo (styles/logo icon-size)]])

 (defn bottom-button [{:keys [accessibility-label
                             label
--- a/src/status_im/ui/components/common/styles.cljs
+++ b/src/status_im/ui/components/common/styles.cljs
@ -50,13 +50,10 @@
                    :padding-bottom   17
                    :margin-top       8}})

-(defstyle form-title
+(def form-title
  {:flex-shrink 1
-   :ios         {:color          colors/text
-                 :letter-spacing -0.2
-                 :font-size      16}
-   :android     {:color     colors/text-gray
-                 :font-size 14}})
+   :color       colors/text
+   :font-size   16})

 (def form-title-count
  (merge form-title
@ -77,11 +74,10 @@
   :align-items        :center})

 (defn network-text [text-color]
-  {:flex           1
-   :color          (or text-color colors/black)
-   :letter-spacing -0.2
-   :font-size      14
-   :margin-left    16})
+  {:flex        1
+   :color       (or text-color colors/black)
+   :font-size   14
+   :margin-left 16})

 (def network-icon
  {:width            40
@ -95,23 +91,13 @@
  {:color     colors/blue
   :font-size 15})

-(defstyle logo-shaddow
-  {:ios     {:shadowColor   colors/black
-             :shadowOffset  {:height 5}
-             :shadowRadius  10
-             :shadowOpacity 0.14}
-   :android {:elevation 2}})
-
-(defn logo-container [size shadow?]
-  (merge
-   {:width            size
-    :height           size
-    :border-radius    size
-    :background-color colors/blue
-    :align-items      :center
-    :justify-content  :center}
-   (when shadow?
-     logo-shaddow)))
+(defn logo-container [size]
+  {:width            size
+   :height           size
+   :border-radius    size
+   :background-color colors/blue
+   :align-items      :center
+   :justify-content  :center})

 (defn logo [icon-size]
  {:color  :white
@ -124,9 +110,8 @@
   :opacity        (if disabled? 0.4 1)})

 (def bottom-button-label
-  {:font-size      15
-   :letter-spacing -0.2
-   :color          colors/blue})
+  {:font-size 15
+   :color     colors/blue})

 (defn button [style background? disabled?]
  (merge
@ -140,10 +125,9 @@
   style))

 (def button-label
-  {:font-size      15
-   :letter-spacing -0.2
-   :text-align     :center
-   :color          colors/blue})
+  {:font-size  15
+   :text-align :center
+   :color      colors/blue})

 (defn counter-container [size]
  {:width            size
--- a/src/status_im/ui/components/contact/styles.cljs
+++ b/src/status_im/ui/components/contact/styles.cljs
@ -20,11 +20,9 @@
  {:flex            1
   :justify-content :center})

-(defstyle name-text
-  {:color   colors/text
-   :android {:font-size 16}
-   :ios     {:font-size      17
-             :letter-spacing -0.2}})
+(def name-text
+  {:color     colors/text
+   :font-size 17})

 (def info-text
  {:margin-top 1
--- a/src/status_im/ui/components/desktop/views.cljs
+++ b/src/status_im/ui/components/desktop/views.cljs
@ -37,10 +37,9 @@
   :background-color colors/blue})

 (def sticky-button-label-style
-  {:color          colors/white
-   :font-size      17
-   :line-height    20
-   :letter-spacing -0.2})
+  {:color       colors/white
+   :font-size   17
+   :line-height 20})

 (defn sticky-button [label on-press]
  [react/touchable-highlight {:on-press on-press}
@ -48,11 +47,11 @@
    [react/text {:style sticky-button-label-style}
     label]]])

-(defn button-label-style [enabled?]
-  {:color          "#4360df"
-   :font-size      15
-   :opacity        (if enabled? 1 0.3)
-   :letter-spacing -0.2})
+(defn button-label-style
+  [enabled?]
+  {:color     colors/blue
+   :font-size 15
+   :opacity   (if enabled? 1 0.3)})

 (defn button [label enabled? on-press]
  [react/touchable-highlight {:on-press on-press :disabled (not enabled?)}
@ -67,10 +66,9 @@
     label]]])

 (def text-button-label-style
-  {:color          :white
-   :height         23
-   :font-size      15
-   :letter-spacing -0.2})
+  {:color     colors/white
+   :height    23
+   :font-size 15})

 (defn text-button [label on-press]
  [react/touchable-highlight {:on-press on-press}
--- a/src/status_im/ui/components/list/styles.cljs
+++ b/src/status_im/ui/components/list/styles.cljs
@ -146,12 +146,11 @@
   :margin-right     6})

 (def new-label-text
-  {:color          colors/white
-   :margin-left    6
-   :margin-right   4
-   :font-size      11
-   :letter-spacing 1
-   :font-weight    :bold})
+  {:color        colors/white
+   :margin-left  6
+   :margin-right 4
+   :font-size    11
+   :font-weight  :bold})

 (def base-separator
  {:height           1
--- a/src/status_im/ui/components/qr_code_viewer/styles.cljs
+++ b/src/status_im/ui/components/qr_code_viewer/styles.cljs
@ -25,10 +25,9 @@
   :ios            {:align-items :center}
   :android        {:margin-left 15}})

-(defstyle name-text
+(def name-text
  {:color     colors/black
-   :font-size 17
-   :ios       {:letter-spacing -0.2}})
+   :font-size 17})

 (def address-text
  {:color     colors/white
@ -64,7 +63,6 @@
   :border-radius      8
   :text-align         :center
   :font-size          15
-   :letter-spacing     -0.2
   :line-height        20})

 (def done-button-text
--- a/src/status_im/ui/components/text_input/styles.cljs
+++ b/src/status_im/ui/components/text_input/styles.cljs
@ -4,9 +4,8 @@
            [status-im.utils.platform :as p]))

 (def label
-  {:font-size      14
-   :letter-spacing -0.2
-   :color          colors/black})
+  {:font-size 14
+   :color     colors/black})

 (defn input-container [height]
  {:padding          16
@ -17,13 +16,12 @@
   :background-color colors/gray-lighter})

 (defstyle input
-  {:font-size      15
-   :letter-spacing -0.2
-   :color          colors/black
-   :padding        0
-   :desktop        {:height 52}})
+  {:font-size 15
+   :color     colors/black
+   :padding   0
+   :desktop   {:height 52}})

 (defn error [label?]
  {:bottom-value (if label? -20 0)
   :color        colors/red-light
-   :font-size    12})
+   :font-size    12})
--- a/src/status_im/ui/components/toolbar/styles.cljs
+++ b/src/status_im/ui/components/toolbar/styles.cljs
@ -17,12 +17,11 @@
   :flex-direction  :column
   :margin-left     6})

-(defstyle toolbar-title-text
-  {:color          colors/black
-   :letter-spacing -0.2
-   :font-size      17
-   :font-weight    :bold
-   :text-align     :center})
+(def toolbar-title-text
+  {:color       colors/black
+   :font-size   17
+   :font-weight :bold
+   :text-align  :center})

 (defn toolbar-actions-container [actions-count custom]
  (merge {:flex-direction :row}
--- a/src/status_im/ui/screens/accounts/create/styles.cljs
+++ b/src/status_im/ui/screens/accounts/create/styles.cljs
@ -15,12 +15,11 @@
   :margin-bottom   100})

 (def account-creating-text
-  {:font-size      14
-   :line-height    21
-   :letter-spacing -0.2
-   :text-align     :center
-   :color          colors/black
-   :margin-top     16})
+  {:font-size   14
+   :line-height 21
+   :text-align  :center
+   :color       colors/black
+   :margin-top  16})

 (def logo-container
  {:margin-top  16
@ -35,10 +34,9 @@
   :margin-top        16})

 (def input-description
-  {:font-size      14
-   :letter-spacing -0.2
-   :color          colors/gray
-   :line-height    21})
+  {:font-size   14
+   :color       colors/gray
+   :line-height 21})

 (def bottom-container
  {:flex-direction    :row
--- a/src/status_im/ui/screens/accounts/styles.cljs
+++ b/src/status_im/ui/screens/accounts/styles.cljs
@ -16,10 +16,9 @@

 (def account-image-size 40)

-(defstyle account-title-text
+(def account-title-text
  {:color     :black
-   :font-size 17
-   :ios       {:letter-spacing -0.2}})
+   :font-size 17})

 (defstyle accounts-list-container
  {:flex          1
@ -40,15 +39,13 @@
   :flex-shrink  1})

 (def account-badge-text
-  {:font-size      17
-   :letter-spacing -0.2
-   :color          colors/black})
+  {:font-size 17
+   :color     colors/black})

-(defstyle account-badge-pub-key-text
-  {:font-size      14
-   :ios            {:letter-spacing -0.2}
-   :color          colors/gray
-   :margin-top     4})
+(def account-badge-pub-key-text
+  {:font-size  14
+   :color      colors/gray
+   :margin-top 4})

 (def bottom-button-container
  {:margin-top    14
--- a/src/status_im/ui/screens/add_new/new_chat/styles.cljs
+++ b/src/status_im/ui/screens/add_new/new_chat/styles.cljs
@ -5,11 +5,10 @@
  {:margin-horizontal 14
   :margin-top        4
   :font-size         12
-   :letter-spacing    -0.2
   :color             colors/red})

 (def list-title
  {:margin-top     24
   :margin-left    16
   :font-size      14
-   :color          colors/gray})
+   :color          colors/gray})
--- a/src/status_im/ui/screens/add_new/new_public_chat/styles.cljs
+++ b/src/status_im/ui/screens/add_new/new_public_chat/styles.cljs
@ -5,7 +5,6 @@
 (def group-chat-name-input
  {:font-size      17
   :padding-bottom 0
-   :letter-spacing -0.2
   :color          colors/black})

 (def topic-hash
@ -20,11 +19,9 @@
 (def chat-name-container
  {:margin-top 10})

-(defstyle members-text
-  {:color   colors/gray
-   :ios     {:letter-spacing -0.2
-             :font-size      16}
-   :android {:font-size 14}})
+(def members-text
+  {:color     colors/gray
+   :font-size 16})

 (def section-title
  (merge members-text
--- a/src/status_im/ui/screens/add_new/styles.cljs
+++ b/src/status_im/ui/screens/add_new/styles.cljs
@ -36,7 +36,6 @@
 (defstyle input
  {:flex               1
   :font-size          15
-   :letter-spacing     -0.2
   :padding-horizontal 14
   :desktop            {:height 30
                        :width "100%"}
--- a/src/status_im/ui/screens/bootnodes_settings/edit_bootnode/styles.cljs
+++ b/src/status_im/ui/screens/bootnodes_settings/edit_bootnode/styles.cljs
@ -12,10 +12,9 @@
   :margin-top        15})

 (defstyle input
-  {:flex               1
-   :font-size          15
-   :letter-spacing     -0.2
-   :android            {:padding 0}})
+  {:flex      1
+   :font-size 15
+   :android   {:padding 0}})

 (def qr-code
  {:margin-right 14})
@ -42,11 +41,9 @@
   :border-radius    8
   :ios              {:opacity 0.9}})

-(defstyle button-label
-  {:color   colors/white
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 14}})
+(def button-label
+  {:color     colors/white
+   :font-size 17})

 (defstyle delete-button
  (assoc button
--- a/src/status_im/ui/screens/bootnodes_settings/styles.cljs
+++ b/src/status_im/ui/screens/bootnodes_settings/styles.cljs
@ -17,12 +17,10 @@
   :ios                {:height 64}
   :android            {:height 56}})

-(defstyle bootnode-item-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :android {:font-size 16}})
+(def bootnode-item-name-text
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})

 (defstyle switch-container
  {:height           50
--- a/src/status_im/ui/screens/browser/site_blocked/styles.cljs
+++ b/src/status_im/ui/screens/browser/site_blocked/styles.cljs
@ -13,22 +13,20 @@
   :justify-content :center
   :align-items     :center})

-(defstyle title-text
+(def title-text
  {:color         colors/black
   :font-size     17
   :font-weight   :bold
   :margin-top    26
   :margin-bottom 10
   :line-height   20
-   :text-align    :center
-   :ios           {:letter-spacing -0.4}})
+   :text-align    :center})

-(defstyle description-text
+(def description-text
  {:color       colors/gray
   :font-size   15
   :line-height 22
-   :text-align  :center
-   :ios         {:letter-spacing -0.2}})
+   :text-align  :center})

 (def chat-link-text
  {:color colors/blue})
@ -36,4 +34,4 @@
 (def buttons-container
  {:flex-direction  :row
   :justify-content :center
-   :margin-top      24})
+   :margin-top      24})
--- a/src/status_im/ui/screens/browser/styles.cljs
+++ b/src/status_im/ui/screens/browser/styles.cljs
@ -82,9 +82,8 @@
   :margin-horizontal 5})

 (def url-text
-  {:font-size         15
-   :line-height       22
-   :letter-spacing    -0.2})
+  {:font-size   15
+   :line-height 22})

 (def dot
  {:height           4
--- a/src/status_im/ui/screens/chat/styles/main.cljs
+++ b/src/status_im/ui/screens/chat/styles/main.cljs
@ -185,12 +185,11 @@
  {:flex-direction :row
   :align-items    :center})

-(defstyle add-contact-text
+(def add-contact-text
  {:text-align          :center
   :text-align-vertical :center
   :padding-left        4
   :font-size           15
-   :ios                 {:letter-spacing 0.2}
   :color               colors/blue})

 (def add-contact-close-icon
@ -217,12 +216,11 @@
   :margin-right     6})

 (def empty-chat-text
-  {:color          colors/gray
-   :width          280
-   :font-size      15
-   :line-height    22
-   :letter-spacing -0.2
-   :text-align     :center})
+  {:color       colors/gray
+   :width       280
+   :font-size   15
+   :line-height 22
+   :text-align  :center})

 (def empty-chat-text-name
  {:margin-bottom 5
--- a/src/status_im/ui/screens/chat/styles/message/datemark.cljs
+++ b/src/status_im/ui/screens/chat/styles/message/datemark.cljs
@ -10,7 +10,6 @@
  {:margin-top       16
   :height           22})

-(defstyle datemark-text
+(def datemark-text
  {:color     colors/gray
-   :ios       {:letter-spacing -0.2}
   :font-size 15})
--- a/src/status_im/ui/screens/chat/styles/message/message.cljs
+++ b/src/status_im/ui/screens/chat/styles/message/message.cljs
@ -5,12 +5,10 @@
            [status-im.utils.platform :as platform]
            [status-im.constants :as constants]))

-(defnstyle style-message-text [outgoing]
+(defn style-message-text
+  [outgoing]
  {:font-size      15
-   :color          (if outgoing colors/white colors/text)
-   :letter-spacing -0.2
-   :android        {:line-height 22}
-   :ios            {:line-height 22}})
+   :color          (if outgoing colors/white colors/text)})

 (defn message-padding-top
  [{:keys [first-in-group? display-username?]}]
@ -36,9 +34,8 @@
             {:padding-left  8}))))

 (def message-timestamp
-  {:font-size      10
-   :letter-spacing 0.1
-   :align-self     :flex-end})
+  {:font-size  10
+   :align-self :flex-end})

 (defn message-timestamp-text [justify-timestamp? outgoing rtl? emoji?]
  (merge message-timestamp
--- a/src/status_im/ui/screens/currency_settings/styles.cljs
+++ b/src/status_im/ui/screens/currency_settings/styles.cljs
@ -15,9 +15,7 @@
   :ios                {:height 64}
   :android            {:height 56}})

-(defstyle currency-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :android {:font-size 16}})
+(def currency-name-text
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})
--- a/src/status_im/ui/screens/extensions/add/styles.cljs
+++ b/src/status_im/ui/screens/extensions/add/styles.cljs
@ -20,10 +20,9 @@
   :margin-top      15})

 (defstyle input
-  {:flex           1
-   :font-size      15
-   :letter-spacing -0.2
-   :android        {:padding 0}})
+  {:flex      1
+   :font-size 15
+   :android   {:padding 0}})

 (def bottom-container
  {:flex-direction    :row
@ -55,4 +54,4 @@
   :background-color colors/white-transparent})

 (def qr-code
-  {:margin-right 14})
+  {:margin-right 14})
--- a/src/status_im/ui/screens/extensions/styles.cljs
+++ b/src/status_im/ui/screens/extensions/styles.cljs
@ -21,7 +21,6 @@
 (defstyle extension-item-name-text
  {:color   colors/black
   :ios     {:font-size      17
-             :letter-spacing -0.2
             :line-height    20}
   :android {:font-size 16}})

--- a/src/status_im/ui/screens/fleet_settings/styles.cljs
+++ b/src/status_im/ui/screens/fleet_settings/styles.cljs
@ -18,21 +18,15 @@
   :ios                {:height 64}
   :android            {:height 56}})

-(defstyle fleet-item-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :desktop {:font-size 16}
-   :android {:font-size 16}})
+(def fleet-item-name-text
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})

 (defstyle fleet-item-connected-text
-  {:color   colors/gray
-   :ios     {:font-size      14
-             :margin-top     6
-             :letter-spacing -0.2}
-   :android {:font-size  12
-             :margin-top 2}})
+  {:color      colors/gray
+   :font-size  14
+   :margin-top 6})

 (defn fleet-icon-container [current?]
  {:width            40
@ -45,4 +39,5 @@
   :justify-content  :center})

 (defn fleet-icon [current?]
-  (hash-map (if platform/desktop? :tint-color :color) (if current? :white :gray)))
+  (hash-map (if platform/desktop? :tint-color :color)
+            (if current? :white :gray)))
--- a/src/status_im/ui/screens/hardwallet/connect/styles.cljs
+++ b/src/status_im/ui/screens/hardwallet/connect/styles.cljs
@ -74,7 +74,6 @@
 (def turn-nfc-text
  {:text-transform :uppercase
   :line-height    20
-   :letter-spacing 0.5
   :color          colors/gray})

 (def go-to-settings-text
--- a/src/status_im/ui/screens/home/styles.cljs
+++ b/src/status_im/ui/screens/home/styles.cljs
@ -185,14 +185,13 @@
   :height 278})

 (defstyle welcome-text
-  {:line-height    28
-   :font-size      22
-   :font-weight    :bold
-   :letter-spacing -0.3
-   :android        {:margin-top 22}
-   :ios            {:margin-top 96}
-   :text-align     :center
-   :color          colors/black})
+  {:line-height 28
+   :font-size   22
+   :font-weight :bold
+   :android     {:margin-top 22}
+   :ios         {:margin-top 96}
+   :text-align  :center
+   :color       colors/black})

 (defstyle welcome-text-description
  {:line-height    21
@ -204,8 +203,7 @@

 (def toolbar-logo
  {:size      40
-   :icon-size 17
-   :shadow?   false})
+   :icon-size 17})

 (def action-button-container
  {:position :absolute
--- a/src/status_im/ui/screens/log_level_settings/styles.cljs
+++ b/src/status_im/ui/screens/log_level_settings/styles.cljs
@ -18,21 +18,15 @@
   :ios                {:height 64}
   :android            {:height 56}})

-(defstyle log-level-item-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :desktop {:font-size 16}
-   :android {:font-size 16}})
+(def log-level-item-name-text
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})

-(defstyle log-level-item-connected-text
-  {:color   colors/gray
-   :ios     {:font-size      14
-             :margin-top     6
-             :letter-spacing -0.2}
-   :android {:font-size  12
-             :margin-top 2}})
+(def log-level-item-connected-text
+  {:color      colors/gray
+   :font-size  14
+   :margin-top 6})

 (defn log-level-icon-container [current?]
  {:width            40
@ -45,4 +39,5 @@
   :justify-content  :center})

 (defn log-level-icon [current?]
-  (hash-map (if platform/desktop? :tint-color :color) (if current? :white :gray)))
+  (hash-map (if platform/desktop? :tint-color :color)
+            (if current? :white :gray)))
--- a/src/status_im/ui/screens/network_settings/edit_network/styles.cljs
+++ b/src/status_im/ui/screens/network_settings/edit_network/styles.cljs
@ -15,12 +15,6 @@
  {:flex-direction :row
   :align-items    :center})

-(defstyle network-type-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 16}})
-
 (def bottom-container
  {:flex-direction    :row
   :margin-horizontal 12
--- a/src/status_im/ui/screens/network_settings/styles.cljs
+++ b/src/status_im/ui/screens/network_settings/styles.cljs
@ -7,28 +7,24 @@
  {:flex             1
   :background-color :white})

-(defstyle badge-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 16}})
+(def badge-name-text
+  {:color     colors/black
+   :font-size 17})

 (defstyle badge-connected-text
  {:color   colors/gray
-   :ios     {:margin-top 5}
-   :android {:font-size 13}})
+   :ios     {:margin-top 5}})

 (defstyle paste-json-text-input
-  {:ios {:font-size      17
-         :line-height    24
-         :letter-spacing -0.2}})
+  {:ios {:font-size   17
+         :line-height 24}})

 (def connect-button-container
  {:margin-top        8
   :margin-bottom     16
   :margin-horizontal 16})

-(defstyle connect-button
+(def connect-button
  {:height           52
   :align-items      :center
   :justify-content  :center
@ -36,18 +32,14 @@
   :border-radius    8
   :ios              {:opacity 0.9}})

-(defstyle connect-button-label
-  {:color   colors/white
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 14}})
+(def connect-button-label
+  {:color     colors/white
+   :font-size 17})

-(defstyle connect-button-description
-  {:color   colors/gray
-   :ios     {:margin-top 8
-             :height     20}
-   :android {:margin-top 12
-             :font-size  12}})
+(def connect-button-description
+  {:color      colors/gray
+   :margin-top 8
+   :height     20})

 (defstyle network-config-container
  {:height            160
@ -61,19 +53,15 @@
   :android           {:border-radius 4}})

 (defstyle network-config-text
-  {:color   colors/black
-   :ios     {:opacity        0.8
-             :font-size      17
-             :line-height    24
-             :letter-spacing -0.2}
-   :android {:opacity     0.4
-             :font-size   16
-             :line-height 24}})
+  {:color       colors/black
+   :font-size   17
+   :line-height 24
+   :ios         {:opacity 0.8}
+   :android     {:opacity 0.4}})

 (def edit-button-container
-  {:margin-top        16
-   :align-items       :center
-   :margin-bottom     16
+  {:align-items       :center
+   :margin-vertical   16
   :margin-horizontal 16})

 (defstyle edit-button
@ -83,30 +71,25 @@
   :background-color colors/blue
   :border-radius    8
   :ios              {:width 343}
-
   :android          {:width 328}})

-(defstyle edit-button-label
-  {:color   colors/blue
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 14}})
+(def edit-button-label
+  {:color     colors/blue
+   :font-size 17})

-(defstyle edit-button-description
+(def edit-button-description
  {:text-align :center
   :color      colors/gray
-   :ios        {:margin-top     8
-                :font-size      14
-                :letter-spacing -0.2}
-   :android    {:margin-top 12
-                :font-size  12}})
+   :margin-top 8
+   :font-size  14})

 (defn network-icon [connected? size]
  {:width            size
   :height           size
   :border-radius    (/ size 2)
   :background-color (if connected? colors/blue colors/gray-lighter)
-   :align-items      :center :justify-content :center})
+   :align-items      :center
+   :justify-content  :center})

 (def network-badge
  {:height         88
@ -122,20 +105,15 @@
   :ios                {:height 64}
   :android            {:height 56}})

-(defstyle network-item-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :android {:font-size 16}})
+(def network-item-name-text
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})

-(defstyle network-item-connected-text
-  {:color   colors/gray
-   :ios     {:font-size      14
-             :margin-top     6
-             :letter-spacing -0.2}
-   :android {:font-size  12
-             :margin-top 2}})
+(def network-item-connected-text
+  {:color      colors/gray
+   :font-size  14
+   :margin-top 6})

 (def bottom-container
  {:flex-direction    :row
--- a/src/status_im/ui/screens/offline_messaging_settings/edit_mailserver/styles.cljs
+++ b/src/status_im/ui/screens/offline_messaging_settings/edit_mailserver/styles.cljs
@ -19,7 +19,6 @@
 (defstyle input
  {:flex               1
   :font-size          15
-   :letter-spacing     -0.2
   :android            {:padding 0}})

 (def qr-code
@ -50,8 +49,6 @@
  (assoc button
         :background-color colors/red))

-(defstyle button-label
-  {:color   colors/white
-   :ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 14}})
+(def button-label
+  {:color     colors/white
+   :font-size 17})
--- a/src/status_im/ui/screens/offline_messaging_settings/styles.cljs
+++ b/src/status_im/ui/screens/offline_messaging_settings/styles.cljs
@ -23,20 +23,9 @@
   :android            {:height 56}})

 (defstyle mailserver-item-name-text
-  {:color   colors/black
-   :ios     {:font-size      17
-             :letter-spacing -0.2
-             :line-height    20}
-   :desktop {:font-size 16}
-   :android {:font-size 16}})
-
-(defstyle mailserver-item-connected-text
-  {:color   colors/gray
-   :ios     {:font-size      14
-             :margin-top     6
-             :letter-spacing -0.2}
-   :android {:font-size  12
-             :margin-top 2}})
+  {:color       colors/black
+   :font-size   17
+   :line-height 20})

 (defn mailserver-icon-container [connected?]
  {:width            40
--- a/src/status_im/ui/screens/pairing/styles.cljs
+++ b/src/status_im/ui/screens/pairing/styles.cljs
@ -104,8 +104,6 @@
   :margin-top        15})

 (defstyle input
-  {:flex               1
-   :font-size          15
-   :letter-spacing     -0.2
-   :android            {:padding 0}})
-
+  {:flex      1
+   :font-size 15
+   :android   {:padding 0}})
--- a/src/status_im/ui/screens/profile/components/styles.cljs
+++ b/src/status_im/ui/screens/profile/components/styles.cljs
@ -32,8 +32,7 @@
   :flex        1
   :desktop     {:height 20
                 :width 200}
-   :ios         {:letter-spacing      -0.2
-                 :margin-top          1
+   :ios         {:margin-top          1
                 :height              45
                 :border-bottom-width 1
                 :border-bottom-color colors/gray-light}
@ -91,12 +90,11 @@
   :font-size     15
   :color         colors/gray})

-(defstyle settings-title
+(def settings-title
  {:color         colors/gray
   :margin-left   16
   :margin-top    18
-   :font-size     14
-   :ios           {:letter-spacing -0.2}})
+   :font-size     14})

 ;; shared profile styles

--- a/src/status_im/ui/screens/profile/contact/styles.cljs
+++ b/src/status_im/ui/screens/profile/contact/styles.cljs
@ -4,7 +4,7 @@

 (def network-info {:background-color :white})

-(defstyle profile-info-item
+(def profile-info-item
  {:flex-direction :row
   :align-items    :center
   :padding-left   16})
@ -13,20 +13,17 @@
  {:flex          1
   :padding-right (if options 16 40)})

-(defstyle profile-info-title
-  {:color       colors/gray
-   :font-size   14
-   :ios         {:letter-spacing -0.2}})
+(def profile-info-title
+  {:color     colors/gray
+   :font-size 14})

 (defstyle profile-setting-spacing
  {:ios     {:height 10}
   :android {:height 7}})

-(defstyle profile-setting-text
-  {:ios     {:font-size      17
-             :letter-spacing -0.2}
-   :android {:font-size 16
-             :color     colors/black}})
+(def profile-setting-text
+  {:font-size 17
+   :color     colors/black})

 (def action-container
  {:background-color colors/white})
@ -60,6 +57,6 @@
  (merge profile-setting-text
         {:color colors/gray}))

-(defstyle contact-profile-info-container
+(def contact-profile-info-container
  {:padding-top      26
   :background-color colors/white})
--- a/src/status_im/ui/screens/profile/seed/styles.cljs
+++ b/src/status_im/ui/screens/profile/seed/styles.cljs
@ -33,16 +33,14 @@
  {:flex-direction :row})

 (def six-word-num
-  {:width          25
-   :text-align     :right
-   :opacity        0.4
-   :font-size      15
-   :letter-spacing -0.2})
+  {:width      25
+   :text-align :right
+   :opacity    0.4
+   :font-size  15})

 (def six-words-word
-  {:margin-left    24
-   :font-size      15
-   :letter-spacing -0.2})
+  {:margin-left 24
+   :font-size   15})

 (def six-words-separator
  {:height 12})
@ -52,14 +50,12 @@
   :padding 16})

 (def twelve-words-label
-  {:font-size      14
-   :line-height    21
-   :letter-spacing -0.2})
+  {:font-size   14
+   :line-height 21})

 (def twelve-words-description
-  {:font-size      14
-   :line-height    21
-   :letter-spacing -0.2})
+  {:font-size   14
+   :line-height 21})

 (def twelve-words-spacer
  {:flex 1})
@ -88,22 +84,19 @@
  {:flex-direction :row})

 (def enter-word-label
-  {:font-size      14
-   :line-height    21
-   :letter-spacing -0.2})
+  {:font-size   14
+   :line-height 21})

 (def enter-word-n
-  {:margin-left    8
-   :font-size      14
-   :line-height    21
-   :letter-spacing -0.2
-   :color          colors/gray})
+  {:margin-left 8
+   :font-size   14
+   :line-height 21
+   :color       colors/gray})

 (def enter-word-n-description
-  {:font-size      14
-   :line-height    21
-   :letter-spacing -0.2
-   :color          colors/gray})
+  {:font-size   14
+   :line-height 21
+   :color       colors/gray})

 (def finish-container
  {:flex               1
@ -121,11 +114,10 @@
   :height 41})

 (def finish-label
-  {:font-size      22
-   :font-weight    :bold
-   :line-height    30
-   :letter-spacing -0.3
-   :text-align     :center})
+  {:font-size   22
+   :font-weight :bold
+   :line-height 30
+   :text-align  :center})

 (def finish-description
  {:margin-top  8
@ -140,10 +132,9 @@
   :margin-bottom  32})

 (def backup-seed
-  {:font-weight    :bold
-   :font-size      15
-   :letter-spacing -0.2
-   :text-align     :center})
+  {:font-weight :bold
+   :font-size   15
+   :text-align  :center})

 (def step-n
  {:margin-top 5
--- a/src/status_im/ui/screens/profile/seed/views.cljs
+++ b/src/status_im/ui/screens/profile/seed/views.cljs
@ -129,7 +129,7 @@
 (defn finish []
  [react/view {:style styles/finish-container}
   [react/view {:style styles/finish-logo-container}
-    [react/view {:style (components.common.styles/logo-container 80 true)}
+    [react/view {:style (components.common.styles/logo-container 80)}
     [icons/icon :main-icons/check styles/ok-icon]]]
   [react/text {:style styles/finish-label}
    (i18n/label :t/you-are-all-set)]
--- a/src/status_im/ui/screens/profile/user/styles.cljs
+++ b/src/status_im/ui/screens/profile/user/styles.cljs
@ -62,9 +62,8 @@
   :align-items    :center})

 (def advanced-button-label
-  {:font-size      15
-   :letter-spacing -0.2
-   :color          colors/blue})
+  {:font-size 15
+   :color     colors/blue})

 (def pair-button
  {:margin-left 32})
--- a/src/status_im/ui/screens/wallet/components/styles.cljs
+++ b/src/status_im/ui/screens/wallet/components/styles.cljs
@ -61,8 +61,7 @@
          :flex           1
          :padding-bottom 0
          :padding-top    0
-          :height         52
-          :letter-spacing -0.2}))
+          :height         52}))

 (def contact-code-text-input
  {:text-align-vertical :top
@ -81,9 +80,8 @@
         {:color colors/white-transparent}))

 (def network
-  {:color          :white
-   :font-size      13
-   :letter-spacing -0.2})
+  {:color     :white
+   :font-size 13})

 (def network-container
  {:padding-horizontal 10
@ -159,15 +157,13 @@
   :border-radius  8})

 (def wallet-name
-  {:color          :white
-   :font-size      15
-   :letter-spacing -0.2})
+  {:color     colors/white
+   :font-size 15})

 (defn participant [address?]
-  {:color          (if address? :white colors/white-transparent)
-   :flex-shrink    1
-   :font-size      15
-   :letter-spacing -0.2})
+  {:color       (if address? :white colors/white-transparent)
+   :flex-shrink 1
+   :font-size   15})

 (def recipient-container
  {:flex-direction :row})
@ -197,10 +193,9 @@
   :flex-direction :row})

 (def wallet-value
-  {:padding-left   6
-   :color          colors/white-transparent
-   :font-size      15
-   :letter-spacing -0.2})
+  {:padding-left 6
+   :color        colors/white-transparent
+   :font-size    15})

 (def wallet-value-amount
  {:flex -1})
@ -211,7 +206,5 @@
   :background-color  colors/white-light-transparent})

 (def button-text
-  {:color          :white
-   :font-size      15
-   :letter-spacing -0.2})
-
+  {:color     colors/white
+   :font-size 15})
--- a/src/status_im/ui/screens/wallet/components/views.cljs
+++ b/src/status_im/ui/screens/wallet/components/views.cljs
@ -35,10 +35,9 @@
 (defn text-input [props text]
  [react/text-input (utils.core/deep-merge {:placeholder-text-color colors/white-transparent
                                            :selection-color        colors/white
-                                            :style                  {:color          colors/white
-                                                                     :font-size      15
-                                                                     :height         52
-                                                                     :letter-spacing -0.2}}
+                                            :style                  {:color     colors/white
+                                                                     :font-size 15
+                                                                     :height    52}}
                                           props)
   text])

--- a/src/status_im/ui/screens/wallet/main/styles.cljs
+++ b/src/status_im/ui/screens/wallet/main/styles.cljs
@ -124,11 +124,10 @@
   :margin-left 6})

 (def wallet-address
-  {:color          :white
-   :text-align     :center
-   :font-size      15
-   :letter-spacing -0.2
-   :line-height    20})
+  {:color       colors/white
+   :text-align  :center
+   :font-size   15
+   :line-height 20})

 (def address-section
  {:flex-grow   1
--- a/src/status_im/ui/screens/wallet/onboarding/styles.cljs
+++ b/src/status_im/ui/screens/wallet/onboarding/styles.cljs
@ -19,10 +19,9 @@
   :justify-content   :center})

 (def signing-word-text
-  {:font-size      15
-   :font-weight    "600"
-   :color          colors/black
-   :letter-spacing -0.2})
+  {:font-size   15
+   :font-weight "600"
+   :color       colors/black})

 (def bottom-buttons
  {:background-color colors/blue
@ -79,21 +78,19 @@
   :height 312})

 (def onboarding-title
-  {:line-height    28
-   :font-size      22
-   :font-weight    :bold
-   :letter-spacing -0.3
-   :text-align     :center
-   :color          colors/white})
+  {:line-height 28
+   :font-size   22
+   :font-weight :bold
+   :text-align  :center
+   :color       colors/white})

 (def onboarding-text
-  {:line-height    21
-   :margin-top     8
-   :margin-bottom  32
-   :font-size      14
-   :letter-spacing -0.2
-   :text-align     :center
-   :color          colors/white-transparent})
+  {:line-height   21
+   :margin-top    8
+   :margin-bottom 32
+   :font-size     14
+   :text-align    :center
+   :color         colors/white-transparent})

 (def set-up-button
  {:flex-direction   :row
--- a/src/status_im/ui/screens/wallet/send/styles.cljs
+++ b/src/status_im/ui/screens/wallet/send/styles.cljs
@ -37,9 +37,8 @@
   :background-color colors/gray-lighter})

 (def signing-phrase
-  {:font-size      15
-   :letter-spacing -0.2
-   :color          colors/black})
+  {:font-size 15
+   :color     colors/black})

 (def signing-phrase-description
  {:padding-top 8})
@ -49,10 +48,9 @@
   :padding-vertical 20})

 (def password
-  {:padding        0
-   :font-size      15
-   :letter-spacing -0.2
-   :height         20})
+  {:padding   0
+   :font-size 15
+   :height    20})

 (def processing-view
  {:position         :absolute