status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

defstyle and defnstyle macro

This commit is contained in:
Roman Volosovskyi 2017-03-15 21:47:48 +02:00
parent 8c126e0779
commit 07f1877c63
5 changed files with 64 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/status_im/android/platform.cljs
View File

@ -23,7 +23,6 @@
:padding-left 16
:padding-right 16}
:toolbar-title-container {:padding-left 30}
:toolbar-title-center? false
:toolbar-with-search-content {:padding-left 30}
:sized-text {:margin-top 0
:additional-height 0}
@ -127,7 +126,6 @@
:bottom-gradient {:height 3}
:input-label {:left 4}
:input-error-text {:margin-left 4}
:main-tab-list {:margin-bottom 20}
:toolbar-nav-action {:width 56
:height 56
:align-items :center

14
src/status_im/components/toolbar_new/styles.cljs
View File

@ -1,4 +1,5 @@
(ns status-im.components.toolbar-new.styles
(:require-macros [status-im.utils.styles :refer [defnstyles]])
(:require [status-im.components.styles :refer [text1-color
color-white
color-light-gray
@ -24,13 +25,12 @@
(merge {:flex-direction :row}
(get-in p/platform-specific [:component-styles :toolbar-new])))
(defn toolbar-nav-actions-container [actions]
(let [center? (get-in p/platform-specific [:component-styles :toolbar-title-center?])]
(merge {:flex-direction :row}
(when center?
{:width (when (and actions (pos? (count actions)))
(-> (+ toolbar-icon-width toolbar-icon-spacing)
(* (count actions))))}))))
(defnstyles toolbar-nav-actions-container
[actions]
{:flex-direction :row
:ios {:width (when (and actions (pos? (count actions)))
(-> (+ toolbar-icon-width toolbar-icon-spacing)
(* (count actions))))}})
(def toolbar-title-container
(merge (get-in p/platform-specific [:component-styles :toolbar-title-container])

8
src/status_im/contacts/styles.cljs
View File

@ -1,4 +1,5 @@
(ns status-im.contacts.styles
(:require-macros [status-im.utils.styles :refer [defstyles]])
(:require [status-im.components.styles :refer [text1-color
text2-color
text3-color
@ -21,9 +22,10 @@
{:flex 1
:background-color toolbar-background2})
(def contacts-list-container
(merge (get-in p/platform-specific [:component-styles :main-tab-list])
{:flex 1}))
(defstyles contacts-list-container
{:flex 1
:android {:margin-bottom 20}
:ios {:margin-bottom 72}})
(def contacts-list
{:background-color color-white})

2
src/status_im/ios/platform.cljs
View File

@ -22,7 +22,6 @@
:padding-left 16
:padding-right 16}
:toolbar-title-container {:align-items :center}
:toolbar-title-center? true
:toolbar-with-search-content {:align-items :center}
:sized-text {:margin-top -5
:additional-height 5}
@ -148,7 +147,6 @@
:bottom-gradient {:height 1}
:input-label {:left 0}
:input-error-text {:margin-left 0}
:main-tab-list {:margin-bottom 72}
:toolbar-search-input {:padding-left 10}
:toolbar-nav-action {:width 46
:height 56

51
src/status_im/utils/styles.clj Normal file
View File

@ -0,0 +1,51 @@
(ns status-im.utils.styles)
(defn body [styles]
`(let [styles# ~styles
common# (dissoc styles# :android :ios)
platform# (keyword status-im.utils.platform/platform)
platform-specific# (get styles# platform#)]
(if platform-specific#
(merge common# platform-specific#)
common#)))
(defmacro defstyles
"Defines styles symbol.
Styles parameter may contain plaform specific styles:
{:width 100
:height 125
:ios {:height 20}
:android {:margin-top 3}}
Reuslting styles for Android:
{:width 100
:height 125
:margin-top 3}
Resulting styles for iOS:
{:width 100
:height 20}"
[style-name styles]
`(def ~style-name
~(body styles)))
(defmacro defnstyles
"Defines styles function.
Styles parameter may contain plaform specific styles:
{:width 100
:height (* a 2)
:ios {:height (/ a 2)}
:android {:margin-top 3}}
Resulting styles for Android (with (= a 10)):
{:width 100
:height 20
:margin-top 3}
Resulting styles for iOS (with (= a 10)):
{:width 100
:height 5}"
[style-name params styles]
`(defn ~style-name
[~@params]
~(body styles)))