diff options
Diffstat (limited to 'src/objects/_badge.vars.scss')
-rw-r--r-- | src/objects/_badge.vars.scss | 38 |
1 files changed, 20 insertions, 18 deletions
diff --git a/src/objects/_badge.vars.scss b/src/objects/_badge.vars.scss index f9a4ed5..4941ccf 100644 --- a/src/objects/_badge.vars.scss +++ b/src/objects/_badge.vars.scss | |||
@@ -38,10 +38,6 @@ $sizes: ( | |||
38 | 'xl' $pad-b--xl $pad-i--xl $pad-i-pill--xl $pad-i-label--xl $font-size--xl, | 38 | 'xl' $pad-b--xl $pad-i--xl $pad-i-pill--xl $pad-i-label--xl $font-size--xl, |
39 | ) !default; | 39 | ) !default; |
40 | 40 | ||
41 | $key-focus--label-color: props.def(--o-badge--key-focus--label-color, props.get(core.$theme, --focus, --text)) !default; | ||
42 | $key-focus--border-color: props.def(--o-badge--key-focus--border-color, props.get(core.$theme, --focus, --border)) !default; | ||
43 | $key-focus--outline-color: props.def(--o-badge--key-focus--outline-color, props.get(core.$theme, --focus, --outline)) !default; | ||
44 | |||
45 | $default-theme-override: () !default; | 41 | $default-theme-override: () !default; |
46 | $default-theme: props.def(--o-badge, ( | 42 | $default-theme: props.def(--o-badge, ( |
47 | --bg: props.get(core.$theme, --text-mute), | 43 | --bg: props.get(core.$theme, --text-mute), |
@@ -57,6 +53,12 @@ $default-theme: props.def(--o-badge, ( | |||
57 | --label: props.get(core.$theme, --bg-l2), | 53 | --label: props.get(core.$theme, --bg-l2), |
58 | ), | 54 | ), |
59 | 55 | ||
56 | --key-focus: ( | ||
57 | --label: props.get(core.$theme, --focus, --text), | ||
58 | --border: props.get(core.$theme, --focus, --border), | ||
59 | --outline: props.get(core.$theme, --focus, --outline), | ||
60 | ), | ||
61 | |||
60 | --quiet: ( | 62 | --quiet: ( |
61 | --bg: props.get(core.$theme, --border-mute), | 63 | --bg: props.get(core.$theme, --border-mute), |
62 | --label: props.get(core.$theme, --heading), | 64 | --label: props.get(core.$theme, --heading), |
@@ -117,36 +119,36 @@ $static-themes: props.def(--o-badge); | |||
117 | )); | 119 | )); |
118 | } | 120 | } |
119 | 121 | ||
120 | $themes-config: --accent --positive --negative --warning !default; | 122 | $themes-config: accent positive negative warning !default; |
121 | 123 | ||
122 | $themes: props.def(--o-badge); | 124 | $themes: props.def(--o-badge); |
123 | 125 | ||
124 | @each $theme in $themes-config { | 126 | @each $theme in $themes-config { |
125 | $themes: props.merge($themes, ( | 127 | $themes: props.merge($themes, ( |
126 | $theme: ( | 128 | --#{$theme}: ( |
127 | --bg: props.get(core.$static-colors, $theme, --900), | 129 | --bg: props.get(core.$theme, --#{$theme}-static, --900), |
128 | --label: props.get(core.$static-colors, $theme, --900-text), | 130 | --label: props.get(core.$theme, --#{$theme}-static, --900-text), |
129 | 131 | ||
130 | --hover: ( | 132 | --hover: ( |
131 | --bg: props.get(core.$static-colors, $theme, --1000), | 133 | --bg: props.get(core.$theme, --#{$theme}-static, --1000), |
132 | --label: props.get(core.$static-colors, $theme, --1000-text), | 134 | --label: props.get(core.$theme, --#{$theme}-static, --1000-text), |
133 | ), | 135 | ), |
134 | 136 | ||
135 | --active: ( | 137 | --active: ( |
136 | --bg: props.get(core.$static-colors, $theme, --1100), | 138 | --bg: props.get(core.$theme, --#{$theme}-static, --1100), |
137 | --label: props.get(core.$static-colors, $theme, --1000-text), | 139 | --label: props.get(core.$theme, --#{$theme}-static, --1000-text), |
138 | ), | 140 | ), |
139 | 141 | ||
140 | --quiet: ( | 142 | --quiet: ( |
141 | --bg: props.get(core.$theme, $theme, --200), | 143 | --bg: props.get(core.$theme, --#{$theme}, --200), |
142 | --label: props.get(core.$theme, $theme, --1100), | 144 | --label: props.get(core.$theme, --#{$theme}, --1100), |
143 | --hover: ( | 145 | --hover: ( |
144 | --bg: props.get(core.$theme, $theme, --300), | 146 | --bg: props.get(core.$theme, --#{$theme}, --300), |
145 | --label: props.get(core.$theme, $theme, --1200), | 147 | --label: props.get(core.$theme, --#{$theme}, --1200), |
146 | ), | 148 | ), |
147 | --active: ( | 149 | --active: ( |
148 | --bg: props.get(core.$theme, $theme, --400), | 150 | --bg: props.get(core.$theme, --#{$theme}, --400), |
149 | --label: props.get(core.$theme, $theme, --1300), | 151 | --label: props.get(core.$theme, --#{$theme}, --1300), |
150 | ), | 152 | ), |
151 | ) | 153 | ) |
152 | ) | 154 | ) |