chore: use with theme for step component (#16399)

This commit is contained in:
Jamie Caprani 2023-06-30 17:02:46 +01:00 committed by GitHub
parent 2d860c363a
commit 4c0a8d9f6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 18 additions and 15 deletions

View File

@ -9,23 +9,23 @@
:height 20})
(defn neutral-border-color
[in-blur-view? override-theme]
[in-blur-view? theme]
(if in-blur-view?
(colors/theme-colors colors/neutral-80-opa-5 colors/white-opa-10 override-theme)
(colors/theme-colors colors/neutral-20 colors/neutral-80 override-theme)))
(colors/theme-colors colors/neutral-80-opa-5 colors/white-opa-10 theme)
(colors/theme-colors colors/neutral-20 colors/neutral-80 theme)))
(def active-background-color (colors/custom-color :blue 50 10))
(def complete-background-color (colors/custom-color :blue 50))
(defn container
[size type in-blur-view? override-theme]
[size type in-blur-view? theme]
(cond-> container-base
(#{1 2} size) (assoc :width 20)
(= size 3) (assoc :width 28)
(= type :neutral)
(assoc :border-width 1
:border-color (neutral-border-color in-blur-view? override-theme))
:border-color (neutral-border-color in-blur-view? theme))
(= type :active)
(assoc :background-color active-background-color)
@ -35,7 +35,7 @@
(defn text-color
([type] (text-color type nil))
([type override-theme]
([type theme]
(case type
(:neutral :active) (colors/theme-colors colors/neutral-100-opa-100 colors/white override-theme)
(:neutral :active) (colors/theme-colors colors/neutral-100-opa-100 colors/white theme)
:complete colors/white)))

View File

@ -2,11 +2,12 @@
(:require
[quo2.components.counter.step.style :as style]
[quo2.components.markdown.text :as text]
[quo2.theme :as theme]
[react-native.core :as rn]
[utils.number]))
(defn step
[{:keys [type accessibility-label override-theme in-blur-view?]} value]
(defn themed-step
[{:keys [type accessibility-label theme in-blur-view?]} value]
(let [type (or type :neutral)
value (utils.number/parse-int value)
label (str value)
@ -14,8 +15,10 @@
[rn/view
{:accessible true
:accessibility-label (or accessibility-label :step-counter)
:style (style/container size type in-blur-view? override-theme)}
:style (style/container size type in-blur-view? theme)}
[text/text
{:weight :medium
:size :label
:style {:color (style/text-color type override-theme)}} label]]))
:style {:color (style/text-color type theme)}} label]]))
(def step (theme/with-theme themed-step))

View File

@ -138,7 +138,7 @@
[quo/text {:size :paragraph-2} (i18n/label :t/forgot-your-password-info-description)]
[rn/view {:style style/forget-password-step-container}
[quo/step {:in-blur-view? true :override-theme :dark} 1]
[quo/step {:in-blur-view? true} 1]
[rn/view
{:style style/forget-password-step-content}
[quo/text {:size :paragraph-2 :weight :semi-bold}
@ -146,7 +146,7 @@
[quo/text {:size :paragraph-2} (i18n/label :t/forgot-your-password-info-remove-app-description)]]]
[rn/view {:style style/forget-password-step-container}
[quo/step {:in-blur-view? true :override-theme :dark} 2]
[quo/step {:in-blur-view? true} 2]
[rn/view
{:style style/forget-password-step-content}
[quo/text {:size :paragraph-2 :weight :semi-bold}
@ -155,7 +155,7 @@
(i18n/label :t/forgot-your-password-info-reinstall-app-description)]]]
[rn/view {:style style/forget-password-step-container}
[quo/step {:in-blur-view? true :override-theme :dark} 3]
[quo/step {:in-blur-view? true} 3]
[rn/view
{:style style/forget-password-step-content}
[rn/view
@ -167,7 +167,7 @@
(i18n/label :t/forgot-your-password-info-signup-with-key-description)]]]
[rn/view {:style style/forget-password-step-container}
[quo/step {:in-blur-view? true :override-theme :dark} 4]
[quo/step {:in-blur-view? true} 4]
[rn/view
{:style style/forget-password-step-content}
[quo/text {:size :paragraph-2 :weight :semi-bold}