summaryrefslogtreecommitdiffstats
path: root/src/objects/_button.vars.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_button.vars.scss')
-rw-r--r--src/objects/_button.vars.scss514
1 files changed, 257 insertions, 257 deletions
diff --git a/src/objects/_button.vars.scss b/src/objects/_button.vars.scss
index 00a11c3..6e2298f 100644
--- a/src/objects/_button.vars.scss
+++ b/src/objects/_button.vars.scss
@@ -41,334 +41,334 @@ $key-focus--border-offset: props.def(--o-button--key-focus--border-offset, props
41$key-focus--outline-width: props.def(--o-button--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default; 41$key-focus--outline-width: props.def(--o-button--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default;
42 42
43$fixed-sizes: ( 43$fixed-sizes: (
44 'sm' $pad-i--sm $pad-i-label--sm $pad-i-pill--sm $pad-b--sm $font-size--sm, 44 'sm' $pad-i--sm $pad-i-label--sm $pad-i-pill--sm $pad-b--sm $font-size--sm,
45 'lg' $pad-i--lg $pad-i-label--lg $pad-i-pill--lg $pad-b--lg $font-size--lg, 45 'lg' $pad-i--lg $pad-i-label--lg $pad-i-pill--lg $pad-b--lg $font-size--lg,
46 'xl' $pad-i--xl $pad-i-label--xl $pad-i-pill--xl $pad-b--xl $font-size--xl, 46 'xl' $pad-i--xl $pad-i-label--xl $pad-i-pill--xl $pad-b--xl $font-size--xl,
47) !default; 47) !default;
48 48
49$themes: props.def(--o-button, (), 'color'); 49$themes: props.def(--o-button, (), 'color');
50 50
51$default-theme-override: () !default; 51$default-theme-override: () !default;
52$default-theme: map.deep-merge(( 52$default-theme: map.deep-merge((
53 --bg-color: props.get(core.$theme, --bg-l2), 53 --bg-color: props.get(core.$theme, --bg-l2),
54 --label-color: props.get(core.$theme, --text), 54 --label-color: props.get(core.$theme, --text),
55 --border-color: props.get(core.$theme, --box, --border) props.get(core.$theme, --box, --border) props.get(core.$theme, --box, --border-strong), 55 --border-color: props.get(core.$theme, --box, --border) props.get(core.$theme, --box, --border) props.get(core.$theme, --box, --border-strong),
56 --shadow-color: props.get(core.$theme, --shadow), 56 --shadow-color: props.get(core.$theme, --shadow),
57 57
58 --hover: ( 58 --hover: (
59 --bg-color: props.get(core.$theme, --bg-l1), 59 --bg-color: props.get(core.$theme, --bg-l1),
60 --label-color: props.get(core.$theme, --heading), 60 --label-color: props.get(core.$theme, --heading),
61 --border-color: props.get(core.$theme, --border), 61 --border-color: props.get(core.$theme, --border),
62 ), 62 ),
63 63
64 --active: ( 64 --active: (
65 --bg-color: props.get(core.$theme, --border-mute), 65 --bg-color: props.get(core.$theme, --border-mute),
66 --label-color: props.get(core.$theme, --heading), 66 --label-color: props.get(core.$theme, --heading),
67 --border-color: props.get(core.$theme, --border-strong), 67 --border-color: props.get(core.$theme, --border-strong),
68 ), 68 ),
69 69
70 --disabled: ( 70 --disabled: (
71 --bg-color: transparent, 71 --bg-color: transparent,
72 --label-color: props.get(core.$theme, --border-strong), 72 --label-color: props.get(core.$theme, --border-strong),
73 --border-color: props.get(core.$theme, --text-disabled), 73 --border-color: props.get(core.$theme, --text-disabled),
74 ), 74 ),
75 75
76 --key-focus: ( 76 --key-focus: (
77 --border-color: props.get(core.$theme, --focus, --border), 77 --border-color: props.get(core.$theme, --focus, --border),
78 --outline-color: props.get(core.$theme, --focus, --outline), 78 --outline-color: props.get(core.$theme, --focus, --outline),
79 ), 79 ),
80 80
81 --highlighted: ( 81 --highlighted: (
82 --border-color: props.get(core.$theme, --focus, --border), 82 --border-color: props.get(core.$theme, --focus, --border),
83 --shadow-color: props.get(core.$theme, --focus, --outline), 83 --shadow-color: props.get(core.$theme, --focus, --outline),
84 ), 84 ),
85 85
86 --selected: ( 86 --selected: (
87 --bg-color: props.get(core.$theme, --text), 87 --bg-color: props.get(core.$theme, --text),
88 --label-color: props.get(core.$theme, --base, --50), 88 --label-color: props.get(core.$theme, --base, --50),
89 --border-color: props.get(core.$theme, --text) props.get(core.$theme, --text) props.get(core.$theme, --heading), 89 --border-color: props.get(core.$theme, --text) props.get(core.$theme, --text) props.get(core.$theme, --heading),
90 90
91 --hover: ( 91 --hover: (
92 --bg-color: props.get(core.$theme, --heading), 92 --bg-color: props.get(core.$theme, --heading),
93 --label-color: props.get(core.$theme, --base, --50), 93 --label-color: props.get(core.$theme, --base, --50),
94 --border-color: props.get(core.$theme, --heading), 94 --border-color: props.get(core.$theme, --heading),
95 ), 95 ),
96 96
97 --active: ( 97 --active: (
98 --bg-color: props.get(core.$theme, --heading), 98 --bg-color: props.get(core.$theme, --heading),
99 --label-color: props.get(core.$theme, --base, --50), 99 --label-color: props.get(core.$theme, --base, --50),
100 --border-color: props.get(core.$theme, --heading), 100 --border-color: props.get(core.$theme, --heading),
101 ), 101 ),
102 102
103 --disabled: ( 103 --disabled: (
104 --bg-color: props.get(core.$theme, --border-mute), 104 --bg-color: props.get(core.$theme, --border-mute),
105 --label-color: props.get(core.$theme, --border-strong), 105 --label-color: props.get(core.$theme, --border-strong),
106 --border-color: props.get(core.$theme, --border-mute), 106 --border-color: props.get(core.$theme, --border-mute),
107 ), 107 ),
108 ), 108 ),
109 109
110 --badge: ( 110 --badge: (
111 --bg-color: props.get(core.$theme, --border-mute), 111 --bg-color: props.get(core.$theme, --border-mute),
112 --label-color: props.get(core.$theme, --heading), 112 --label-color: props.get(core.$theme, --heading),
113 --border-color: props.get(core.$theme, --border-mute), 113 --border-color: props.get(core.$theme, --border-mute),
114 114
115 --hover: ( 115 --hover: (
116 --bg-color: props.get(core.$theme, --border), 116 --bg-color: props.get(core.$theme, --border),
117 --label-color: props.get(core.$theme, --heading), 117 --label-color: props.get(core.$theme, --heading),
118 --border-color: props.get(core.$theme, --border), 118 --border-color: props.get(core.$theme, --border),
119 ), 119 ),
120 120
121 --active: ( 121 --active: (
122 --bg-color: props.get(core.$theme, --border-strong), 122 --bg-color: props.get(core.$theme, --border-strong),
123 --label-color: props.get(core.$theme, --heading), 123 --label-color: props.get(core.$theme, --heading),
124 --border-color: props.get(core.$theme, --border-strong), 124 --border-color: props.get(core.$theme, --border-strong),
125 ), 125 ),
126 ), 126 ),
127 127
128 --quiet: ( 128 --quiet: (
129 --label-color: props.get(core.$theme, --text), 129 --label-color: props.get(core.$theme, --text),
130 130
131 --hover: ( 131 --hover: (
132 --bg-color: props.get(core.$theme, --border-mute), 132 --bg-color: props.get(core.$theme, --border-mute),
133 --label-color: props.get(core.$theme, --heading), 133 --label-color: props.get(core.$theme, --heading),
134 ), 134 ),
135 135
136 --active: ( 136 --active: (
137 --bg-color: props.get(core.$theme, --border), 137 --bg-color: props.get(core.$theme, --border),
138 --label-color: props.get(core.$theme, --heading), 138 --label-color: props.get(core.$theme, --heading),
139 ), 139 ),
140 140
141 --disabled: ( 141 --disabled: (
142 --label-color: props.get(core.$theme, --border-strong), 142 --label-color: props.get(core.$theme, --border-strong),
143 ), 143 ),
144 ), 144 ),
145), $default-theme-override) !default; 145), $default-theme-override) !default;
146$default-theme: props.def(--o-button, $default-theme, 'color'); 146$default-theme: props.def(--o-button, $default-theme, 'color');
147 147
148$default-theme-dark-override: () !default; 148$default-theme-dark-override: () !default;
149$default-theme-dark: map.deep-merge(( 149$default-theme-dark: map.deep-merge((
150 --bg-color: props.get(core.$theme, --border-mute), 150 --bg-color: props.get(core.$theme, --border-mute),
151 --border-color: props.get(core.$theme, --border-mute), 151 --border-color: props.get(core.$theme, --border-mute),
152 152
153 --hover: ( 153 --hover: (
154 --bg-color: props.get(core.$theme, --border), 154 --bg-color: props.get(core.$theme, --border),
155 --border-color: props.get(core.$theme, --border), 155 --border-color: props.get(core.$theme, --border),
156 ), 156 ),
157 157
158 --active: ( 158 --active: (
159 --bg-color: props.get(core.$theme, --border-strong), 159 --bg-color: props.get(core.$theme, --border-strong),
160 --border-color: props.get(core.$theme, --border-strong), 160 --border-color: props.get(core.$theme, --border-strong),
161 ), 161 ),
162 162
163 --selected: ( 163 --selected: (
164 --border-color: props.get(core.$theme, --text), 164 --border-color: props.get(core.$theme, --text),
165 ), 165 ),
166), $default-theme-override) !default; 166), $default-theme-override) !default;
167$default-theme-dark: props.def(--o-button, $default-theme-dark, 'dark'); 167$default-theme-dark: props.def(--o-button, $default-theme-dark, 'dark');
168 168
169@each $theme in map.keys(props.get(core.$transparent-colors)) { 169@each $theme in map.keys(props.get(core.$transparent-colors)) {
170 $button-theme: --static-#{string.slice($theme, 3)}; 170 $button-theme: --static-#{string.slice($theme, 3)};
171 171
172 $themes: props.merge($themes, ( 172 $themes: props.merge($themes, (
173 $button-theme: ( 173 $button-theme: (
174 --bg-color: props.get(core.$transparent-colors, $theme, --200), 174 --bg-color: props.get(core.$transparent-colors, $theme, --200),
175 --label-color: props.get(core.$transparent-colors, $theme, --900), 175 --label-color: props.get(core.$transparent-colors, $theme, --900),
176 --border-color: props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --400), 176 --border-color: props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --400),
177 --shadow-color: props.get(core.$transparent-colors, --black, --200), 177 --shadow-color: props.get(core.$transparent-colors, --black, --200),
178 178
179 --hover: ( 179 --hover: (
180 --bg-color: props.get(core.$transparent-colors, $theme, --300), 180 --bg-color: props.get(core.$transparent-colors, $theme, --300),
181 --label-color: props.get(core.$transparent-colors, $theme, --900), 181 --label-color: props.get(core.$transparent-colors, $theme, --900),
182 --border-color: props.get(core.$transparent-colors, $theme, --400), 182 --border-color: props.get(core.$transparent-colors, $theme, --400),
183 ), 183 ),
184 184
185 --active: ( 185 --active: (
186 --bg-color: props.get(core.$transparent-colors, $theme, --400), 186 --bg-color: props.get(core.$transparent-colors, $theme, --400),
187 --label-color: props.get(core.$transparent-colors, $theme, --900), 187 --label-color: props.get(core.$transparent-colors, $theme, --900),
188 --border-color: props.get(core.$transparent-colors, $theme, --500), 188 --border-color: props.get(core.$transparent-colors, $theme, --500),
189 ), 189 ),
190 190
191 --disabled: ( 191 --disabled: (
192 --bg-color: props.get(core.$transparent-colors, $theme, --100), 192 --bg-color: props.get(core.$transparent-colors, $theme, --100),
193 --label-color: props.get(core.$transparent-colors, $theme, --500), 193 --label-color: props.get(core.$transparent-colors, $theme, --500),
194 --border-color: props.get(core.$transparent-colors, $theme, --300), 194 --border-color: props.get(core.$transparent-colors, $theme, --300),
195 ), 195 ),
196 196
197 --key-focus: ( 197 --key-focus: (
198 --border-color: props.get(core.$transparent-colors, $theme, --900), 198 --border-color: props.get(core.$transparent-colors, $theme, --900),
199 --outline-color: props.get(core.$transparent-colors, $theme, --300), 199 --outline-color: props.get(core.$transparent-colors, $theme, --300),
200 ), 200 ),
201 201
202 --highlighted: ( 202 --highlighted: (
203 --border-color: props.get(core.$transparent-colors, $theme, --900), 203 --border-color: props.get(core.$transparent-colors, $theme, --900),
204 --shadow-color: props.get(core.$transparent-colors, --black, --200), 204 --shadow-color: props.get(core.$transparent-colors, --black, --200),
205 ), 205 ),
206 206
207 --selected: ( 207 --selected: (
208 --bg-color: props.get(core.$transparent-colors, $theme, --800), 208 --bg-color: props.get(core.$transparent-colors, $theme, --800),
209 --label-color: props.get(core.$transparent-colors, $theme, --text), 209 --label-color: props.get(core.$transparent-colors, $theme, --text),
210 --border-color: props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --200), 210 --border-color: props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --200),
211 211
212 --hover: ( 212 --hover: (
213 --bg-color: props.get(core.$transparent-colors, $theme, --900), 213 --bg-color: props.get(core.$transparent-colors, $theme, --900),
214 --label-color: props.get(core.$transparent-colors, $theme, --text), 214 --label-color: props.get(core.$transparent-colors, $theme, --text),
215 --border-color: props.get(core.$transparent-colors, $theme, --100), 215 --border-color: props.get(core.$transparent-colors, $theme, --100),
216 ), 216 ),
217 217
218 --active: ( 218 --active: (
219 --bg-color: props.get(core.$transparent-colors, $theme, --900), 219 --bg-color: props.get(core.$transparent-colors, $theme, --900),
220 --label-color: props.get(core.$transparent-colors, $theme, --text), 220 --label-color: props.get(core.$transparent-colors, $theme, --text),
221 --border-color: props.get(core.$transparent-colors, $theme, --100), 221 --border-color: props.get(core.$transparent-colors, $theme, --100),
222 ), 222 ),
223 223
224 --disabled: ( 224 --disabled: (
225 --bg-color: props.get(core.$transparent-colors, $theme, --200), 225 --bg-color: props.get(core.$transparent-colors, $theme, --200),
226 --label-color: props.get(core.$transparent-colors, $theme, --500), 226 --label-color: props.get(core.$transparent-colors, $theme, --500),
227 --border-color: props.get(core.$transparent-colors, $theme, --100), 227 --border-color: props.get(core.$transparent-colors, $theme, --100),
228 ), 228 ),
229 ), 229 ),
230 230
231 --badge: ( 231 --badge: (
232 --bg-color: props.get(core.$transparent-colors, $theme, --200), 232 --bg-color: props.get(core.$transparent-colors, $theme, --200),
233 --label-color: props.get(core.$transparent-colors, $theme, --900), 233 --label-color: props.get(core.$transparent-colors, $theme, --900),
234 --border-color: transparent, 234 --border-color: transparent,
235 235
236 --hover: ( 236 --hover: (
237 --bg-color: props.get(core.$transparent-colors, $theme, --300), 237 --bg-color: props.get(core.$transparent-colors, $theme, --300),
238 --label-color: props.get(core.$transparent-colors, $theme, --900), 238 --label-color: props.get(core.$transparent-colors, $theme, --900),
239 --border-color: transparent, 239 --border-color: transparent,
240 ), 240 ),
241 241
242 --active: ( 242 --active: (
243 --bg-color: props.get(core.$transparent-colors, $theme, --400), 243 --bg-color: props.get(core.$transparent-colors, $theme, --400),
244 --label-color: props.get(core.$transparent-colors, $theme, --900), 244 --label-color: props.get(core.$transparent-colors, $theme, --900),
245 --border-color: transparent, 245 --border-color: transparent,
246 ), 246 ),
247 ), 247 ),
248 248
249 --quiet: ( 249 --quiet: (
250 --label-color: props.get(core.$transparent-colors, $theme, --900), 250 --label-color: props.get(core.$transparent-colors, $theme, --900),
251 251
252 --hover: ( 252 --hover: (
253 --bg-color: props.get(core.$transparent-colors, $theme, --200), 253 --bg-color: props.get(core.$transparent-colors, $theme, --200),
254 --label-color: props.get(core.$transparent-colors, $theme, --900), 254 --label-color: props.get(core.$transparent-colors, $theme, --900),
255 ), 255 ),
256 256
257 --active: ( 257 --active: (
258 --bg-color: props.get(core.$transparent-colors, $theme, --300), 258 --bg-color: props.get(core.$transparent-colors, $theme, --300),
259 --label-color: props.get(core.$transparent-colors, $theme, --900), 259 --label-color: props.get(core.$transparent-colors, $theme, --900),
260 ), 260 ),
261 261
262 --disabled: ( 262 --disabled: (
263 --label-color: props.get(core.$transparent-colors, $theme, --500), 263 --label-color: props.get(core.$transparent-colors, $theme, --500),
264 ), 264 ),
265 ), 265 ),
266 ) 266 )
267 )); 267 ));
268} 268}
269 269
270$themes-config: ( 270$themes-config: (
271 accent: --accent, 271 accent: --accent,
272 positive: --positive, 272 positive: --positive,
273 negative: --negative, 273 negative: --negative,
274 warning: --warning, 274 warning: --warning,
275) !default; 275) !default;
276 276
277@each $theme, $key in $themes-config { 277@each $theme, $key in $themes-config {
278 $themes: props.merge($themes, ( 278 $themes: props.merge($themes, (
279 --#{$theme}: ( 279 --#{$theme}: (
280 --bg-color: props.get(core.$theme, $key, --100), 280 --bg-color: props.get(core.$theme, $key, --100),
281 --label-color: props.get(core.$theme, $key, --1100), 281 --label-color: props.get(core.$theme, $key, --1100),
282 --border-color: props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --600), 282 --border-color: props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --600),
283 --shadow-color: props.get(core.$theme, $key, --200), 283 --shadow-color: props.get(core.$theme, $key, --200),
284 284
285 --hover: ( 285 --hover: (
286 --bg-color: props.get(core.$theme, $key, --200), 286 --bg-color: props.get(core.$theme, $key, --200),
287 --label-color: props.get(core.$theme, $key, --1200), 287 --label-color: props.get(core.$theme, $key, --1200),
288 --border-color: props.get(core.$theme, $key, --600), 288 --border-color: props.get(core.$theme, $key, --600),
289 ), 289 ),
290 290
291 --active: ( 291 --active: (
292 --bg-color: props.get(core.$theme, $key, --300), 292 --bg-color: props.get(core.$theme, $key, --300),
293 --label-color: props.get(core.$theme, $key, --1300), 293 --label-color: props.get(core.$theme, $key, --1300),
294 --border-color: props.get(core.$theme, $key, --800), 294 --border-color: props.get(core.$theme, $key, --800),
295 ), 295 ),
296 296
297 --disabled: ( 297 --disabled: (
298 --bg-color: props.get(core.$theme, --bg-l1), 298 --bg-color: props.get(core.$theme, --bg-l1),
299 --label-color: props.get(core.$theme, --border-strong), 299 --label-color: props.get(core.$theme, --border-strong),
300 --border-color: props.get(core.$theme, --border), 300 --border-color: props.get(core.$theme, --border),
301 ), 301 ),
302 302
303 --key-focus: ( 303 --key-focus: (
304 --border-color: props.get(core.$theme, --focus, --border), 304 --border-color: props.get(core.$theme, --focus, --border),
305 --outline-color: props.get(core.$theme, --focus, --outline), 305 --outline-color: props.get(core.$theme, --focus, --outline),
306 ), 306 ),
307 307
308 --highlighted: ( 308 --highlighted: (
309 --border-color: props.get(core.$theme, $key, --900), 309 --border-color: props.get(core.$theme, $key, --900),
310 --shadow-color: props.get(core.$theme, $key, --200), 310 --shadow-color: props.get(core.$theme, $key, --200),
311 ), 311 ),
312 312
313 --selected: ( 313 --selected: (
314 --bg-color: props.get(core.$theme, #{$key}-static, --900), 314 --bg-color: props.get(core.$theme, #{$key}-static, --900),
315 --label-color: props.get(core.$theme, #{$key}-static, --900-text), 315 --label-color: props.get(core.$theme, #{$key}-static, --900-text),
316 --border-color: props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --1000), 316 --border-color: props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --1000),
317 317
318 --hover: ( 318 --hover: (
319 --bg-color: props.get(core.$theme, #{$key}-static, --1000), 319 --bg-color: props.get(core.$theme, #{$key}-static, --1000),
320 --label-color: props.get(core.$theme, #{$key}-static, --1000-text), 320 --label-color: props.get(core.$theme, #{$key}-static, --1000-text),
321 --border-color: props.get(core.$theme, #{$key}-static, --1000), 321 --border-color: props.get(core.$theme, #{$key}-static, --1000),
322 ), 322 ),
323 323
324 --active: ( 324 --active: (
325 --bg-color: props.get(core.$theme, #{$key}-static, --1100), 325 --bg-color: props.get(core.$theme, #{$key}-static, --1100),
326 --label-color: props.get(core.$theme, #{$key}-static, --1100-text), 326 --label-color: props.get(core.$theme, #{$key}-static, --1100-text),
327 --border-color: props.get(core.$theme, #{$key}-static, --1100), 327 --border-color: props.get(core.$theme, #{$key}-static, --1100),
328 ), 328 ),
329 329
330 --disabled: ( 330 --disabled: (
331 --bg-color: props.get(core.$theme, --border-mute), 331 --bg-color: props.get(core.$theme, --border-mute),
332 --label-color: props.get(core.$theme, --border-strong), 332 --label-color: props.get(core.$theme, --border-strong),
333 --border-color: props.get(core.$theme, --border-mute), 333 --border-color: props.get(core.$theme, --border-mute),
334 ), 334 ),
335 ), 335 ),
336 336
337 --badge: ( 337 --badge: (
338 --bg-color: props.get(core.$theme, $key, --100), 338 --bg-color: props.get(core.$theme, $key, --100),
339 --label-color: props.get(core.$theme, $key, --1100), 339 --label-color: props.get(core.$theme, $key, --1100),
340 --border-color: props.get(core.$theme, $key, --300), 340 --border-color: props.get(core.$theme, $key, --300),
341 341
342 --hover: ( 342 --hover: (
343 --bg-color: props.get(core.$theme, $key, --200), 343 --bg-color: props.get(core.$theme, $key, --200),
344 --label-color: props.get(core.$theme, $key, --1200), 344 --label-color: props.get(core.$theme, $key, --1200),
345 --border-color: props.get(core.$theme, $key, --400), 345 --border-color: props.get(core.$theme, $key, --400),
346 ), 346 ),
347 347
348 --active: ( 348 --active: (
349 --bg-color: props.get(core.$theme, $key, --300), 349 --bg-color: props.get(core.$theme, $key, --300),
350 --label-color: props.get(core.$theme, $key, --1300), 350 --label-color: props.get(core.$theme, $key, --1300),
351 --border-color: props.get(core.$theme, $key, --500), 351 --border-color: props.get(core.$theme, $key, --500),
352 ), 352 ),
353 ), 353 ),
354 354
355 --quiet: ( 355 --quiet: (
356 --label-color: props.get(core.$theme, $key, --1100), 356 --label-color: props.get(core.$theme, $key, --1100),
357 357
358 --hover: ( 358 --hover: (
359 --bg-color: props.get(core.$theme, $key, --200), 359 --bg-color: props.get(core.$theme, $key, --200),
360 --label-color: props.get(core.$theme, $key, --1200), 360 --label-color: props.get(core.$theme, $key, --1200),
361 ), 361 ),
362 362
363 --active: ( 363 --active: (
364 --bg-color: props.get(core.$theme, $key, --300), 364 --bg-color: props.get(core.$theme, $key, --300),
365 --label-color: props.get(core.$theme, $key, --1300), 365 --label-color: props.get(core.$theme, $key, --1300),
366 ), 366 ),
367 367
368 --disabled: ( 368 --disabled: (
369 --label-color: props.get(core.$theme, --border-strong), 369 --label-color: props.get(core.$theme, --border-strong),
370 ), 370 ),
371 ), 371 ),
372 ) 372 )
373 )); 373 ));
374} 374}
generated by cgit v1.3.1 (git 2.54.0) at 2026-07-22 03:42:20 +0000