replace require-macro for defnstyle and defstyle

- renamed the macros def and defn so that they are now used with aliased
namespace `styles/def` and `styles/defn` to force user to use aliased require
instead of require-macro and refer
- this makes sure the cljs file is required which includes the require for
platform ns needed after macroexpension

Signed-off-by: yenda <eric@status.im>
This commit is contained in:
yenda 2019-09-25 12:44:07 +02:00
parent 9d0de73c1e
commit bf6b328996
No known key found for this signature in database
GPG Key ID: 0095623C0069DCE6
45 changed files with 165 additions and 184 deletions

View File

@ -12,6 +12,8 @@ The general fix for that type of issue is to have two files for the namespace wh
That way you don't need to use any magical call like `find-ns` or inline `require` with some kind of call only once switch (which was the root cause of another bug in ``defstyle`` macro because the compilation phase at which the evaluation of the switch is done was not properly considered). That way you don't need to use any magical call like `find-ns` or inline `require` with some kind of call only once switch (which was the root cause of another bug in ``defstyle`` macro because the compilation phase at which the evaluation of the switch is done was not properly considered).
You also want to make sure users are using the macro by using a aliased namespace defined in require statement rather than require-macro and refer to the macro directly. Otherwise it won't require the cljs file and the require statement of the namespace in the macroexpension might not be there.
## Stacktrace ## Stacktrace
``` ```

View File

@ -1,5 +1,4 @@
(ns status-im.chat.commands.impl.transactions.styles (ns status-im.chat.commands.impl.transactions.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def asset-container (def asset-container

View File

@ -1,5 +1,4 @@
(ns status-im.network.ui.edit-network.styles (ns status-im.network.ui.edit-network.styles
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles])) [status-im.ui.components.styles :as styles]))

View File

@ -1,7 +1,7 @@
(ns status-im.network.ui.styles (ns status-im.network.ui.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as components.styles])) [status-im.ui.components.styles :as components.styles]
[status-im.utils.styles :as styles]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -10,7 +10,7 @@
(def badge-name-text (def badge-name-text
{:font-size 17}) {:font-size 17})
(defstyle badge-connected-text (styles/def badge-connected-text
{:color colors/gray {:color colors/gray
:ios {:margin-top 5}}) :ios {:margin-top 5}})
@ -39,7 +39,7 @@
:margin-top 8 :margin-top 8
:height 20}) :height 20})
(defstyle network-config-container (styles/def network-config-container
{:height 160 {:height 160
:margin-top 8 :margin-top 8
:padding-top 16 :padding-top 16
@ -50,7 +50,7 @@
:opacity 0.9} :opacity 0.9}
:android {:border-radius 4}}) :android {:border-radius 4}})
(defstyle network-config-text (styles/def network-config-text
{:font-size 17 {:font-size 17
:ios {:opacity 0.8} :ios {:opacity 0.8}
:android {:opacity 0.4}}) :android {:opacity 0.4}})
@ -60,7 +60,7 @@
:margin-vertical 16 :margin-vertical 16
:margin-horizontal 16}) :margin-horizontal 16})
(defstyle edit-button (styles/def edit-button
{:height 52 {:height 52
:align-items :center :align-items :center
:justify-content :center :justify-content :center
@ -93,7 +93,7 @@
:flex-direction :row :flex-direction :row
:align-items :center}) :align-items :center})
(defstyle network-item (styles/def network-item
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center

View File

@ -1,11 +1,11 @@
(ns status-im.ui.components.common.styles (ns status-im.ui.components.common.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def separator-wrapper (def separator-wrapper
{:background-color colors/white}) {:background-color colors/white})
(defstyle separator (styles/def separator
{:android {:height 0} {:android {:height 0}
:ios {:height 1 :ios {:height 1
:background-color colors/black-transparent :background-color colors/black-transparent

View File

@ -1,9 +1,8 @@
(ns status-im.ui.components.connectivity.styles (ns status-im.ui.components.connectivity.styles
(:require-macros [status-im.utils.styles :refer [defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform])) [status-im.utils.platform :as platform]))
(defnstyle text-wrapper (defn text-wrapper
[{:keys [window-width height background-color opacity transform]}] [{:keys [window-width height background-color opacity transform]}]
(cond-> {:flex-direction :row (cond-> {:flex-direction :row
:justify-content :center :justify-content :center

View File

@ -1,6 +1,6 @@
(ns status-im.ui.components.list.styles (ns status-im.ui.components.list.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def item (def item
{:flex-direction :row {:flex-direction :row
@ -146,11 +146,11 @@
base-separator base-separator
{:margin-left 64})) {:margin-left 64}))
(defstyle list-header-footer-spacing (styles/def list-header-footer-spacing
{:android {:background-color colors/white {:android {:background-color colors/white
:height 8}}) :height 8}})
(defstyle section-header (styles/def section-header
{:font-size 14 {:font-size 14
:color colors/gray :color colors/gray
:margin-left 16 :margin-left 16

View File

@ -1,8 +1,7 @@
(ns status-im.ui.components.status-bar.styles (ns status-im.ui.components.status-bar.styles
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles] [status-im.utils.platform :as platform]
[status-im.utils.platform :as platform]) [status-im.utils.styles :as styles]))
(:require-macros [status-im.utils.styles :refer [defstyle]]))
(defn- create-status-bar-style [{:keys [background-color bar-style translucent?] (defn- create-status-bar-style [{:keys [background-color bar-style translucent?]
:or {bar-style "light-content"}}] :or {bar-style "light-content"}}]
@ -17,13 +16,13 @@
:height height}) :height height})
;; :main ;; :main
(defstyle status-bar-main (styles/def status-bar-main
{:ios (create-status-bar-style {:background-color colors/white {:ios (create-status-bar-style {:background-color colors/white
:bar-style "default"}) :bar-style "default"})
:android (create-status-bar-style {:translucent? true :android (create-status-bar-style {:translucent? true
:bar-style "dark-content"})}) :bar-style "dark-content"})})
(defstyle status-bar-main-main (styles/def status-bar-main-main
{:ios (create-status-bar-style {:background-color colors/white {:ios (create-status-bar-style {:background-color colors/white
:bar-style "default"}) :bar-style "default"})
:android (create-status-bar-style {:background-color colors/black :android (create-status-bar-style {:background-color colors/black
@ -32,13 +31,13 @@
(def view-main (def view-main
(create-view-style {:background-color colors/white})) (create-view-style {:background-color colors/white}))
(defstyle view-modal-main (styles/def view-modal-main
{:ios (create-view-style {:background-color colors/white}) {:ios (create-view-style {:background-color colors/white})
:android (create-view-style {:background-color colors/black :android (create-view-style {:background-color colors/black
:height 0})}) :height 0})})
;; :transparent ;; :transparent
(defstyle status-bar-transparent (styles/def status-bar-transparent
{:ios (create-status-bar-style {:background-color colors/transparent}) {:ios (create-status-bar-style {:background-color colors/transparent})
:android (create-status-bar-style {:translucent? true})}) :android (create-status-bar-style {:translucent? true})})
@ -46,23 +45,23 @@
(create-view-style {:background-color colors/transparent})) (create-view-style {:background-color colors/transparent}))
;; :modal ;; :modal
(defstyle status-bar-modal (styles/def status-bar-modal
{:ios (create-status-bar-style {:background-color "#2f3031"}) {:ios (create-status-bar-style {:background-color "#2f3031"})
:android (create-status-bar-style {:background-color colors/black})}) :android (create-status-bar-style {:background-color colors/black})})
(defstyle view-modal (styles/def view-modal
{:ios (create-view-style {:background-color "#2f3031"}) {:ios (create-view-style {:background-color "#2f3031"})
:android (create-view-style {:background-color colors/black :android (create-view-style {:background-color colors/black
:height 0})}) :height 0})})
;; :modal-white ;; :modal-white
(defstyle status-bar-modal-white (styles/def status-bar-modal-white
{:ios (create-status-bar-style {:background-color colors/white {:ios (create-status-bar-style {:background-color colors/white
:bar-style "default"}) :bar-style "default"})
:android (create-status-bar-style {:background-color colors/black :android (create-status-bar-style {:background-color colors/black
:bar-style "light-content"})}) :bar-style "light-content"})})
(defstyle view-modal-white (styles/def view-modal-white
{:ios (create-view-style {:background-color colors/white}) {:ios (create-view-style {:background-color colors/white})
:android (create-view-style {:background-color colors/black :android (create-view-style {:background-color colors/black
:height 0})}) :height 0})})
@ -71,17 +70,17 @@
(def status-bar-modal-wallet (def status-bar-modal-wallet
(create-status-bar-style {:background-color colors/blue})) (create-status-bar-style {:background-color colors/blue}))
(defstyle view-modal-wallet (styles/def view-modal-wallet
{:ios (create-view-style {:background-color colors/blue}) {:ios (create-view-style {:background-color colors/blue})
:android (create-view-style {:background-color colors/blue :android (create-view-style {:background-color colors/blue
:height 0})}) :height 0})})
;; :transaction ;; :transaction
(defstyle status-bar-transaction (styles/def status-bar-transaction
{:ios (create-status-bar-style {:background-color colors/transparent}) {:ios (create-status-bar-style {:background-color colors/transparent})
:android (create-status-bar-style {:background-color colors/black})}) :android (create-status-bar-style {:background-color colors/black})})
(defstyle view-transaction (styles/def view-transaction
{:ios (create-view-style {:background-color colors/transparent}) {:ios (create-view-style {:background-color colors/transparent})
:android (create-view-style {:background-color colors/black :android (create-view-style {:background-color colors/black
:height 0})}) :height 0})})
@ -89,7 +88,7 @@
;; TODO(jeluard) Fix status-bar mess by removing useless view and introducing 2dn level tab-bar ;; TODO(jeluard) Fix status-bar mess by removing useless view and introducing 2dn level tab-bar
;; :wallet HOME ;; :wallet HOME
(defstyle status-bar-wallet-tab (styles/def status-bar-wallet-tab
{:ios (create-status-bar-style {:background-color colors/blue}) {:ios (create-status-bar-style {:background-color colors/blue})
:android (create-status-bar-style {:translucent? true})}) :android (create-status-bar-style {:translucent? true})})
@ -97,7 +96,7 @@
(create-view-style {:background-color colors/blue})) (create-view-style {:background-color colors/blue}))
;; :wallet ;; :wallet
(defstyle status-bar-wallet (styles/def status-bar-wallet
{:ios (create-status-bar-style {:background-color colors/blue}) {:ios (create-status-bar-style {:background-color colors/blue})
:android (create-status-bar-style {:translucent? true})}) :android (create-status-bar-style {:translucent? true})})
@ -105,11 +104,11 @@
(create-view-style {:background-color colors/blue})) (create-view-style {:background-color colors/blue}))
;; :default ;; :default
(defstyle status-bar-default (styles/def status-bar-default
{:ios (create-status-bar-style {:background-color colors/white {:ios (create-status-bar-style {:background-color colors/white
:bar-style "default"}) :bar-style "default"})
:android (create-status-bar-style {:translucent? true :android (create-status-bar-style {:translucent? true
:bar-style "dark-content"})}) :bar-style "dark-content"})})
(defstyle view-default (def view-default
(create-view-style {})) (create-view-style {}))

View File

@ -1,8 +1,8 @@
(ns status-im.ui.components.tabbar.styles (ns status-im.ui.components.tabbar.styles
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.animation :as animation]
[status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform] [status-im.utils.platform :as platform]
[status-im.ui.components.animation :as animation]) [status-im.utils.styles :as styles]))
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]]))
(def tabs-height (def tabs-height
(cond (cond
@ -31,7 +31,7 @@
:justify-content :center :justify-content :center
:align-items :center}) :align-items :center})
(defnstyle tab-title [active?] (styles/defn tab-title [active?]
{:ios {:font-size 11} {:ios {:font-size 11}
:android {:font-size 11} :android {:font-size 11}
:desktop {:font-size 12 :desktop {:font-size 12
@ -79,7 +79,7 @@
{:color (if active? colors/blue colors/gray) {:color (if active? colors/blue colors/gray)
:font-size 11}) :font-size 11})
(defstyle new-tabs-container (styles/def new-tabs-container
{:height tabs-height {:height tabs-height
:align-self :stretch :align-self :stretch
:ios {:background-color :white :ios {:background-color :white

View File

@ -1,7 +1,7 @@
(ns status-im.ui.components.text-input.styles (ns status-im.ui.components.text-input.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as p])) [status-im.utils.platform :as p]
[status-im.utils.styles :as styles]))
(defn label [editable] (defn label [editable]
(merge (merge
@ -19,7 +19,7 @@
{:border-color colors/gray-lighter {:border-color colors/gray-lighter
:border-width 1}))) :border-width 1})))
(defstyle input (styles/def input
{:padding 0 {:padding 0
:text-align-vertical :top :text-align-vertical :top
:desktop {:height 52}}) :desktop {:height 52}})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.components.toolbar.styles (ns status-im.ui.components.toolbar.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def toolbar-height 56) (def toolbar-height 56)
@ -40,7 +39,7 @@
(def item-text (def item-text
{:color colors/blue}) {:color colors/blue})
(defstyle item-text-action (def item-text-action
{:color colors/blue}) {:color colors/blue})
(def toolbar-text-action-disabled (def toolbar-text-action-disabled

View File

@ -1,7 +1,6 @@
(ns status-im.ui.components.tooltip.styles (ns status-im.ui.components.tooltip.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.styles :as styles] [status-im.utils.styles :as styles]))
[status-im.ui.components.colors :as colors]))
(def tooltip-container (def tooltip-container
{:position :absolute {:position :absolute
@ -10,7 +9,7 @@
:right 0 :right 0
:top 0}) :top 0})
(defstyle bottom-tooltip-container (styles/def bottom-tooltip-container
{:position :absolute {:position :absolute
:align-items :center :align-items :center
:left 12 :left 12

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.add-new.new-public-chat.styles (ns status-im.ui.screens.add-new.new-public-chat.styles
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def group-chat-name-input (def group-chat-name-input

View File

@ -1,7 +1,7 @@
(ns status-im.ui.screens.add-new.styles (ns status-im.ui.screens.add-new.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles])) [status-im.ui.components.styles :as components.styles]
[status-im.utils.styles :as styles]))
(def new-chat-container (def new-chat-container
{:flex-direction :row {:flex-direction :row
@ -10,7 +10,7 @@
(def input-container (def input-container
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
:border-radius styles/border-radius :border-radius components.styles/border-radius
:height 52 :height 52
:background-color colors/gray-lighter :background-color colors/gray-lighter
:margin-horizontal 14 :margin-horizontal 14
@ -25,7 +25,7 @@
(def button-container (def button-container
{:justify-content :center {:justify-content :center
:border-radius styles/border-radius :border-radius components.styles/border-radius
:height 52 :height 52
:background-color colors/gray-lighter :background-color colors/gray-lighter
:padding-horizontal 15 :padding-horizontal 15
@ -33,7 +33,7 @@
:margin-left 3 :margin-left 3
:margin-top 24}) :margin-top 24})
(defnstyle input [w] (styles/defn input [w]
{:padding-horizontal 14 {:padding-horizontal 14
:width w :width w
:desktop {:height 30 :desktop {:height 30

View File

@ -1,17 +1,17 @@
(ns status-im.ui.screens.bootnodes-settings.edit-bootnode.styles (ns status-im.ui.screens.bootnodes-settings.edit-bootnode.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.styles :as styles] [status-im.ui.components.styles :as components.styles]
[status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def input-container (def input-container
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
:justify-content :space-between :justify-content :space-between
:border-radius styles/border-radius :border-radius components.styles/border-radius
:height 52 :height 52
:margin-top 15}) :margin-top 15})
(defstyle input (styles/def input
{:flex 1 {:flex 1
:android {:padding 0}}) :android {:padding 0}})
@ -33,7 +33,7 @@
:margin-bottom 16 :margin-bottom 16
:margin-horizontal 16}) :margin-horizontal 16})
(def button (styles/def button
{:height 52 {:height 52
:align-items :center :align-items :center
:justify-content :center :justify-content :center
@ -44,11 +44,11 @@
{:color colors/white {:color colors/white
:font-size 17}) :font-size 17})
(defstyle delete-button (def delete-button
(assoc button (assoc button
:background-color colors/red)) :background-color colors/red))
(def container (def container
(merge (merge
styles/flex components.styles/flex
{:background-color colors/white})) {:background-color colors/white}))

View File

@ -1,6 +1,6 @@
(ns status-im.ui.screens.bootnodes-settings.styles (ns status-im.ui.screens.bootnodes-settings.styles
(:require [status-im.ui.components.colors :as colors]) (:require [status-im.ui.components.colors :as colors]
(:require-macros [status-im.utils.styles :refer [defstyle]])) [status-im.utils.styles :as styles]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -9,7 +9,7 @@
(def bootnode-item-inner (def bootnode-item-inner
{:padding-horizontal 16}) {:padding-horizontal 16})
(defstyle bootnode-item (styles/def bootnode-item
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center
@ -20,7 +20,7 @@
(def bootnode-item-name-text (def bootnode-item-name-text
{:font-size 17}) {:font-size 17})
(defstyle switch-container (def switch-container
{:height 50 {:height 50
:background-color colors/white :background-color colors/white
:padding-left 15}) :padding-left 15})

View File

@ -1,10 +1,10 @@
(ns status-im.ui.screens.browser.open-dapp.styles (ns status-im.ui.screens.browser.open-dapp.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles])) [status-im.ui.components.styles :as components.styles]
[status-im.utils.styles :as styles]))
(defstyle input (styles/def input
{:border-radius styles/border-radius {:border-radius components.styles/border-radius
:background-color colors/gray-lighter :background-color colors/gray-lighter
:margin-horizontal 16 :margin-horizontal 16
:margin-bottom 9 :margin-bottom 9
@ -62,4 +62,4 @@
:font-weight "500" :font-weight "500"
:color colors/gray :color colors/gray
:line-height 18 :line-height 18
:margin-top 2}) :margin-top 2})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.browser.site-blocked.styles (ns status-im.ui.screens.browser.site-blocked.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def container (def container

View File

@ -1,10 +1,10 @@
(ns status-im.ui.screens.browser.styles (ns status-im.ui.screens.browser.styles
(:require [status-im.ui.components.colors :as colors]) (:require [status-im.ui.components.colors :as colors]
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])) [status-im.utils.styles :as styles]))
(def browser {:flex 1}) (def browser {:flex 1})
(defstyle dapp-name (styles/def dapp-name
{:flex 1 {:flex 1
:justify-content :center :justify-content :center
:margin-left 12 :margin-left 12
@ -13,7 +13,7 @@
(def dapp-name-text (def dapp-name-text
{:font-size 16}) {:font-size 16})
(defstyle dapp-text (styles/def dapp-text
{:color colors/gray {:color colors/gray
:ios {:margin-top 4} :ios {:margin-top 4}
:android {:font-size 13}}) :android {:font-size 13}})
@ -63,7 +63,7 @@
:margin-top 10 :margin-top 10
:margin-left 56}) :margin-left 56})
(defstyle url-input (def url-input
{:flex 1 {:flex 1
:text-align-vertical :center :text-align-vertical :center
:margin 0 :margin 0

View File

@ -1,14 +1,14 @@
(ns status-im.ui.screens.chat.styles.input.input (ns status-im.ui.screens.chat.styles.input.input
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.screens.chat.styles.message.message :refer [message-author-name]])) [status-im.ui.screens.chat.styles.message.message :refer [message-author-name]]
[status-im.utils.styles :as styles]))
(def min-input-height 36) (def min-input-height 36)
(def padding-vertical 8) (def padding-vertical 8)
(def border-height 1) (def border-height 1)
(def max-input-height (* 5 min-input-height)) (def max-input-height (* 5 min-input-height))
(defnstyle root [margin-bottom] (defn root [margin-bottom]
{:background-color colors/white {:background-color colors/white
:margin-bottom margin-bottom :margin-bottom margin-bottom
:flex-direction :column :flex-direction :column
@ -75,7 +75,7 @@
:min-height min-input-height :min-height min-input-height
:max-height max-input-height}) :max-height max-input-height})
(defnstyle input-view [single-line-input?] (styles/defn input-view [single-line-input?]
{:flex 1 {:flex 1
:padding-top 9 :padding-top 9
:padding-bottom 5 :padding-bottom 5
@ -92,7 +92,7 @@
:background-color :transparent :background-color :transparent
:color :transparent}) :color :transparent})
(defnstyle invisible-input-text-height [container-width] (styles/defn invisible-input-text-height [container-width]
{:width container-width {:width container-width
:flex 1 :flex 1
:padding-top 5 :padding-top 5
@ -103,7 +103,7 @@
:background-color :transparent :background-color :transparent
:color :transparent}) :color :transparent})
(defnstyle input-helper-view [left opacity] (styles/defn input-helper-view [left opacity]
{:opacity opacity {:opacity opacity
:position :absolute :position :absolute
:height min-input-height :height min-input-height
@ -111,7 +111,7 @@
:ios {:left left} :ios {:left left}
:desktop {:left left}}) :desktop {:left left}})
(defnstyle input-helper-text [left] (styles/defn input-helper-text [left]
{:color colors/gray {:color colors/gray
:text-align-vertical :center :text-align-vertical :center
:flex 1 :flex 1
@ -119,7 +119,7 @@
:ios {:line-height min-input-height} :ios {:line-height min-input-height}
:desktop {:line-height min-input-height}}) :desktop {:line-height min-input-height}})
(defnstyle seq-input-text [left container-width] (styles/defn seq-input-text [left container-width]
{:min-width (- container-width left) {:min-width (- container-width left)
:position :absolute :position :absolute
:text-align-vertical :center :text-align-vertical :center

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.chat.styles.input.suggestions (ns status-im.ui.screens.chat.styles.input.suggestions
(:require-macros [status-im.utils.styles :refer [defnstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def item-height 52) (def item-height 52)

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.chat.styles.message.datemark (ns status-im.ui.screens.chat.styles.message.datemark
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def datemark-wrapper (def datemark-wrapper

View File

@ -1,9 +1,9 @@
(ns status-im.ui.screens.chat.styles.message.message (ns status-im.ui.screens.chat.styles.message.message
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) (:require [status-im.constants :as constants]
(:require [status-im.ui.components.colors :as colors] [status-im.ui.components.colors :as colors]
[status-im.ui.screens.chat.styles.photos :as photos] [status-im.ui.screens.chat.styles.photos :as photos]
[status-im.utils.platform :as platform] [status-im.utils.platform :as platform]
[status-im.constants :as constants])) [status-im.utils.styles :as styles]))
(defn style-message-text (defn style-message-text
[outgoing] [outgoing]
@ -132,7 +132,7 @@
:line-height 22 :line-height 22
:margin-bottom (if collapsed? 2 0))) :margin-bottom (if collapsed? 2 0)))
(defnstyle emoji-message (styles/defn emoji-message
[{:keys [incoming-group]}] [{:keys [incoming-group]}]
{:font-size 40 {:font-size 40
:desktop {:line-height 46} :desktop {:line-height 46}

View File

@ -1,9 +1,8 @@
(ns status-im.ui.screens.chat.styles.message.options (ns status-im.ui.screens.chat.styles.message.options
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.styles :as styles] [status-im.utils.styles :as styles]))
[status-im.ui.components.colors :as colors]))
(defstyle row (styles/def row
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center

View File

@ -1,12 +1,12 @@
(ns status-im.ui.screens.currency-settings.styles (ns status-im.ui.screens.currency-settings.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
:background-color :white}) :background-color :white})
(defstyle currency-item (styles/def currency-item
{:flex-direction :row {:flex-direction :row
:justify-content :space-between :justify-content :space-between
:background-color :white :background-color :white

View File

@ -1,7 +1,7 @@
(ns status-im.ui.screens.fleet-settings.styles (ns status-im.ui.screens.fleet-settings.styles
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform]) [status-im.utils.platform :as platform]
(:require-macros [status-im.utils.styles :refer [defstyle]])) [status-im.utils.styles :as styles]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -10,7 +10,7 @@
(def fleet-item-inner (def fleet-item-inner
{:padding-horizontal 16}) {:padding-horizontal 16})
(defstyle fleet-item (styles/def fleet-item
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center
@ -21,7 +21,7 @@
(def fleet-item-name-text (def fleet-item-name-text
{:font-size 17}) {:font-size 17})
(defstyle fleet-item-connected-text (def fleet-item-connected-text
{:color colors/gray {:color colors/gray
:font-size 14 :font-size 14
:margin-top 6}) :margin-top 6})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.group.styles (ns status-im.ui.screens.group.styles
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(defn toolbar-icon [enabled?] (defn toolbar-icon [enabled?]

View File

@ -1,19 +1,19 @@
(ns status-im.ui.screens.hardwallet.pin.styles (ns status-im.ui.screens.hardwallet.pin.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def container (def container
{:flex 1 {:flex 1
:background-color colors/white}) :background-color colors/white})
(defstyle pin-container (styles/def pin-container
{:flex 1 {:flex 1
:flex-direction :column :flex-direction :column
:justify-content :space-between :justify-content :space-between
:android {:margin-top 10} :android {:margin-top 10}
:ios {:margin-top 10}}) :ios {:margin-top 10}})
(defstyle error-container (styles/def error-container
{:height 22}) {:height 22})
(def error-text (def error-text

View File

@ -1,6 +1,6 @@
(ns status-im.ui.screens.hardwallet.setup.styles (ns status-im.ui.screens.hardwallet.setup.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def container (def container
{:flex 1 {:flex 1
@ -249,7 +249,7 @@
:text-align :center :text-align :center
:border-color colors/gray-lighter}) :border-color colors/gray-lighter})
(defstyle puk-code-numbers-inner-container (styles/def puk-code-numbers-inner-container
{:width "85%" {:width "85%"
:android {:margin-horizontal 16} :android {:margin-horizontal 16}
:height 94 :height 94

View File

@ -1,15 +1,15 @@
(ns status-im.ui.screens.home.styles (ns status-im.ui.screens.home.styles
(:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform])) [status-im.utils.styles :as styles]))
(defn toolbar [] (defn toolbar []
{:background-color colors/white}) {:background-color colors/white})
(defstyle sync-wrapper (def sync-wrapper
{:flex-direction :row}) {:flex-direction :row})
(defstyle sync-info {:margin-horizontal 15}) (def sync-info
{:margin-horizontal 15})
(def last-message-container (def last-message-container
{:flex-shrink 1}) {:flex-shrink 1})
@ -39,11 +39,10 @@
:justify-content :center :justify-content :center
:border-radius 8}) :border-radius 8})
(def search-input (styles/def search-input
(merge {:flex 1} {:flex 1
(when platform/android? :android {:margin 0
{:margin 0 :padding 0}})
:padding 0})))
(def filter-section-title (def filter-section-title
{:margin-left 16 {:margin-left 16
@ -62,7 +61,7 @@
:width 16 :width 16
:height 16}) :height 16})
(defstyle datetime-text (def datetime-text
{:color colors/text-gray {:color colors/text-gray
:font-size 10 :font-size 10
:text-align :right :text-align :right
@ -70,7 +69,7 @@
:align-items :center :align-items :center
:line-height 12}) :line-height 12})
(defstyle new-messages-text (styles/def new-messages-text
{:left 0 {:left 0
:font-size 12 :font-size 12
:color colors/blue :color colors/blue

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.intro.styles (ns status-im.ui.screens.intro.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def intro-view (def intro-view

View File

@ -1,7 +1,7 @@
(ns status-im.ui.screens.log-level-settings.styles (ns status-im.ui.screens.log-level-settings.styles
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform]) [status-im.utils.platform :as platform]
(:require-macros [status-im.utils.styles :refer [defstyle]])) [status-im.utils.styles :as styles]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -10,7 +10,7 @@
(def log-level-item-inner (def log-level-item-inner
{:padding-horizontal 16}) {:padding-horizontal 16})
(defstyle log-level-item (styles/def log-level-item
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center

View File

@ -1,13 +1,11 @@
(ns status-im.ui.screens.multiaccounts.login.styles (ns status-im.ui.screens.multiaccounts.login.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]]) (:require [status-im.ui.components.colors :as colors]))
(:require [status-im.ui.components.styles :as st]
[status-im.ui.components.colors :as colors]))
(defstyle login-view (def login-view
{:flex 1 {:flex 1
:margin-horizontal 16}) :margin-horizontal 16})
(defstyle login-badge-container (def login-badge-container
{:margin-top 24}) {:margin-top 24})
(def processing-view (def processing-view

View File

@ -1,11 +1,11 @@
(ns status-im.ui.screens.multiaccounts.recover.styles (ns status-im.ui.screens.multiaccounts.recover.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def screen-container (def screen-container
{:flex 1}) {:flex 1})
(defstyle inputs-container (styles/def inputs-container
{:margin 16 {:margin 16
:desktop {:padding-top 15}}) :desktop {:padding-top 15}})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.multiaccounts.styles (ns status-im.ui.screens.multiaccounts.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.styles :as common] (:require [status-im.ui.components.styles :as common]
[status-im.ui.components.colors :as colors])) [status-im.ui.components.colors :as colors]))
@ -21,11 +20,11 @@
{:color :black {:color :black
:font-size 17}) :font-size 17})
(defstyle multiaccounts-list-container (def multiaccounts-list-container
{:flex 1 {:flex 1
:padding-bottom 8}) :padding-bottom 8})
(defstyle multiaccount-view (def multiaccount-view
{:background-color :white {:background-color :white
:flex-direction :row :flex-direction :row
:align-items :center :align-items :center

View File

@ -1,7 +1,7 @@
(ns status-im.ui.screens.offline-messaging-settings.edit-mailserver.styles (ns status-im.ui.screens.offline-messaging-settings.edit-mailserver.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.styles :as components.styles]
(:require [status-im.ui.components.styles :as styles] [status-im.ui.components.colors :as colors]
[status-im.ui.components.colors :as colors])) [status-im.utils.styles :as styles]))
(def edit-mailserver-view (def edit-mailserver-view
{:flex 1 {:flex 1
@ -12,11 +12,11 @@
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
:justify-content :space-between :justify-content :space-between
:border-radius styles/border-radius :border-radius components.styles/border-radius
:height 52 :height 52
:margin-top 15}) :margin-top 15})
(defstyle input (styles/def input
{:flex 1 {:flex 1
:android {:padding 0}}) :android {:padding 0}})
@ -40,11 +40,11 @@
:border-radius 8 :border-radius 8
:ios {:opacity 0.9}}) :ios {:opacity 0.9}})
(defstyle connect-button (styles/def connect-button
(assoc button (assoc button
:background-color colors/blue)) :background-color colors/blue))
(defstyle delete-button (styles/def delete-button
(assoc button (assoc button
:background-color colors/red)) :background-color colors/red))

View File

@ -1,8 +1,7 @@
(ns status-im.ui.screens.offline-messaging-settings.styles (ns status-im.ui.screens.offline-messaging-settings.styles
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.utils.platform :as platform]) [status-im.utils.platform :as platform]
(:require-macros [status-im.utils.styles :refer [defnstyle [status-im.utils.styles :as styles]))
defstyle]]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -11,7 +10,7 @@
(def mailserver-item-inner (def mailserver-item-inner
{:padding-horizontal 16}) {:padding-horizontal 16})
(defnstyle mailserver-item [pinned?] (styles/defn mailserver-item [pinned?]
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center
@ -36,7 +35,8 @@
:justify-content :center}) :justify-content :center})
(defn mailserver-icon [connected?] (defn mailserver-icon [connected?]
(hash-map (if platform/desktop? :tint-color :color) (if connected? :white :gray))) (hash-map (if platform/desktop? :tint-color :color)
(if connected? :white :gray)))
(def mailserver-pinned (def mailserver-pinned
{:padding-horizontal 16 {:padding-horizontal 16

View File

@ -1,8 +1,7 @@
(ns status-im.ui.screens.pairing.styles (ns status-im.ui.screens.pairing.styles
(:require (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles] [status-im.ui.components.styles :as components.styles]
[status-im.ui.components.colors :as colors]) [status-im.utils.styles :as styles]))
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]]))
(def wrapper (def wrapper
{:flex 1 {:flex 1
@ -12,7 +11,7 @@
{:flex 1 {:flex 1
:flex-direction :row}) :flex-direction :row})
(defstyle installation-item (styles/def installation-item
{:flex-direction :row {:flex-direction :row
:background-color :white :background-color :white
:align-items :center :align-items :center
@ -73,7 +72,7 @@
{:color colors/blue {:color colors/blue
:margin-bottom 6}) :margin-bottom 6})
(defnstyle pairing-button-icon [enabled?] (styles/defn pairing-button-icon [enabled?]
(let [color (if enabled? (let [color (if enabled?
colors/blue colors/blue
colors/gray)] colors/gray)]
@ -94,10 +93,10 @@
{:flex-direction :row {:flex-direction :row
:align-items :center :align-items :center
:justify-content :space-between :justify-content :space-between
:border-radius styles/border-radius :border-radius components.styles/border-radius
:height 52 :height 52
:margin-top 15}) :margin-top 15})
(defstyle input (styles/def input
{:flex 1 {:flex 1
:android {:padding 0}}) :android {:padding 0}})

View File

@ -1,7 +1,6 @@
(ns status-im.ui.screens.profile.components.styles (ns status-im.ui.screens.profile.components.styles
(:require-macros [status-im.utils.styles :refer [defstyle]]) (:require [status-im.ui.components.colors :as colors]
(:require [status-im.ui.components.styles :as styles] [status-im.utils.styles :as styles]))
[status-im.ui.components.colors :as colors]))
;; profile header elements ;; profile header elements
@ -14,21 +13,21 @@
{:flex-direction :column {:flex-direction :column
:justify-content :center}) :justify-content :center})
(defstyle profile-name-text (def profile-name-text
{:typography :header {:typography :header
:line-height 28 :line-height 28
:text-align :left}) :text-align :left})
(defstyle profile-name-text-with-subtitle (def profile-name-text-with-subtitle
{:margin-vertical 5 {:margin-vertical 5
:typography :header :typography :header
:line-height 28 :line-height 28
:text-align :left}) :text-align :left})
(defstyle profile-three-words (def profile-three-words
{:color colors/gray}) {:color colors/gray})
(defstyle profile-name-input-text (styles/def profile-name-input-text
{:text-align :center {:text-align :center
:flex 1 :flex 1
:desktop {:height 20 :desktop {:height 20
@ -120,4 +119,4 @@
{:color colors/gray {:color colors/gray
:padding 24 :padding 24
:line-height 22 :line-height 22
:font-size 15}) :font-size 15})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.profile.contact.styles (ns status-im.ui.screens.profile.contact.styles
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(def action-container (def action-container

View File

@ -7,7 +7,7 @@
{:flex 1 {:flex 1
:background-color :white}) :background-color :white})
(styles/defstyle barcode-scanner (styles/def barcode-scanner
{:flex 1 {:flex 1
:elevation -10 :elevation -10
:android {:marginTop 10}}) :android {:marginTop 10}})

View File

@ -1,7 +1,6 @@
(ns status-im.ui.screens.wallet.components.styles (ns status-im.ui.screens.wallet.components.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.styles :as styles])) [status-im.ui.components.styles :as components.styles]))
(def cartouche-container (def cartouche-container
{:flex 1 {:flex 1
@ -12,7 +11,7 @@
(merge (merge
{:flex-direction :row {:flex-direction :row
:margin-top 8 :margin-top 8
:border-radius styles/border-radius :border-radius components.styles/border-radius
:padding-left 14 :padding-left 14
:padding-right 8} :padding-right 8}
(if disabled? (if disabled?
@ -101,7 +100,7 @@
(def asset-text (def asset-text
{:color colors/white}) {:color colors/white})
(defstyle container-disabled (def container-disabled
{:border-width 1 {:border-width 1
:border-color colors/white-transparent-10 :border-color colors/white-transparent-10
:border-radius 8}) :border-radius 8})
@ -176,4 +175,4 @@
:border-radius (/ 40 2) :border-radius (/ 40 2)
:background-color colors/green :background-color colors/green
:align-items :center :align-items :center
:justify-content :center}) :justify-content :center})

View File

@ -1,5 +1,4 @@
(ns status-im.ui.screens.wallet.send.styles (ns status-im.ui.screens.wallet.send.styles
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.screens.wallet.components.styles :as wallet.components.styles])) [status-im.ui.screens.wallet.components.styles :as wallet.components.styles]))
@ -54,4 +53,4 @@
:placeholder "0.000" :placeholder "0.000"
:placeholder-text-color colors/white-transparent :placeholder-text-color colors/white-transparent
:selection-color colors/white :selection-color colors/white
:style wallet.components.styles/text-input}) :style wallet.components.styles/text-input})

View File

@ -1,9 +1,9 @@
(ns status-im.ui.screens.wallet.transactions.styles (ns status-im.ui.screens.wallet.transactions.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.colors :as colors] (:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.tabbar.styles :as tabs.styles])) [status-im.ui.components.tabbar.styles :as tabs.styles]
[status-im.utils.styles :as styles]))
(defnstyle tab [active?] (defn tab [active?]
{:flex 1 {:flex 1
:height tabs.styles/tab-height :height tabs.styles/tab-height
:justify-content :center :justify-content :center
@ -38,7 +38,7 @@
:margin-top 22 :margin-top 22
:margin-horizontal 92}) :margin-horizontal 92})
(defstyle amount-time (styles/def amount-time
{:flex-direction :row {:flex-direction :row
:justify-content :space-between :justify-content :space-between
:padding-right 22 :padding-right 22

View File

@ -1,6 +1,7 @@
(ns status-im.utils.styles) (ns status-im.utils.styles
(:refer-clojure :exclude [defn def]))
(defn body [style] (defn- body [style]
`(let [style# ~style `(let [style# ~style
common# (dissoc style# :android :ios :desktop) common# (dissoc style# :android :ios :desktop)
platform# (keyword status-im.utils.platform/os) platform# (keyword status-im.utils.platform/os)
@ -9,7 +10,7 @@
(merge common# platform-specific#) (merge common# platform-specific#)
common#))) common#)))
(defmacro defstyle (defmacro def
"Defines style symbol. "Defines style symbol.
Style parameter may contain platform specific style: Style parameter may contain platform specific style:
{:width 100 {:width 100
@ -29,7 +30,7 @@
`(def ~style-name `(def ~style-name
~(body style))) ~(body style)))
(defmacro defnstyle (defmacro defn
"Defines style function. "Defines style function.
Style parameter may contain platform specific style: Style parameter may contain platform specific style:
{:width 100 {:width 100
@ -46,6 +47,6 @@
{:width 100 {:width 100
:height 5}" :height 5}"
[style-name params style] [style-name params style]
`(defn ~style-name `(clojure.core/defn ~style-name
[~@params] [~@params]
~(body style))) ~(body style)))