@happyvertical/smrt-ui 0.40.67 → 0.40.69

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/components/data/DataTable.svelte +1 -1
  2. package/dist/components/feedback/LoadingOverlay.svelte +1 -1
  3. package/dist/components/forms/Combobox.svelte +1 -1
  4. package/dist/components/forms/FilePicker.svelte +1 -1
  5. package/dist/components/forms/Input.svelte +1 -1
  6. package/dist/components/forms/InputGroup.svelte +1 -1
  7. package/dist/components/forms/Listbox.svelte +1 -1
  8. package/dist/components/forms/MultiSelect.svelte +1 -1
  9. package/dist/components/forms/RangeSlider.svelte +1 -1
  10. package/dist/components/forms/Select.svelte +1 -1
  11. package/dist/components/forms/Slider.svelte +1 -1
  12. package/dist/components/forms/TagsInput.svelte +1 -1
  13. package/dist/components/forms/Textarea.svelte +1 -1
  14. package/dist/components/roles/RoleSelector.svelte +10 -3
  15. package/dist/components/ui/Dropdown.svelte +11 -3
  16. package/dist/components/ui/Popover.svelte +1 -1
  17. package/dist/themes/ThemeProvider.svelte +40 -42
  18. package/dist/themes/ThemeProvider.svelte.d.ts +10 -0
  19. package/dist/themes/ThemeProvider.svelte.d.ts.map +1 -1
  20. package/dist/themes/__tests__/control-boundary-contrast.test.js +112 -0
  21. package/dist/themes/__tests__/css-generator.test.js +42 -0
  22. package/dist/themes/__tests__/styles-lockstep.test.js +32 -0
  23. package/dist/themes/__tests__/theme-provider.test.js +46 -8
  24. package/dist/themes/__tests__/theme-script.test.js +16 -11
  25. package/dist/themes/css-generator.d.ts +5 -0
  26. package/dist/themes/css-generator.d.ts.map +1 -1
  27. package/dist/themes/css-generator.js +5 -0
  28. package/dist/themes/glass/index.d.ts.map +1 -1
  29. package/dist/themes/glass/index.js +12 -4
  30. package/dist/themes/smrt/index.d.ts.map +1 -1
  31. package/dist/themes/smrt/index.js +8 -2
  32. package/dist/themes/studio/index.d.ts.map +1 -1
  33. package/dist/themes/studio/index.js +6 -2
  34. package/dist/themes/styles/glass.css +316 -84
  35. package/dist/themes/styles/material.css +355 -53
  36. package/dist/themes/styles/smrt.css +4 -4
  37. package/dist/themes/styles/studio.css +308 -72
  38. package/dist/themes/theme-script.d.ts +12 -4
  39. package/dist/themes/theme-script.d.ts.map +1 -1
  40. package/dist/themes/theme-script.js +14 -19
  41. package/package.json +3 -2
@@ -67,43 +67,34 @@
67
67
  }
68
68
 
69
69
  [data-theme="material"][data-color-scheme="light"] {
70
- /* Primary */
70
+ --smrt-theme-id: material;
71
+ --smrt-theme-name: Material;
72
+ --smrt-color-scheme: light;
73
+ --smrt-font-family: "Google Sans", "Roboto", system-ui, -apple-system, sans-serif;
71
74
  --smrt-color-primary: #0b57d0;
72
75
  --smrt-color-on-primary: #ffffff;
73
76
  --smrt-color-primary-container: #d3e3fd;
74
77
  --smrt-color-on-primary-container: #041e49;
75
-
76
- /* Secondary */
77
78
  --smrt-color-secondary: #5e5e5e;
78
79
  --smrt-color-on-secondary: #ffffff;
79
80
  --smrt-color-secondary-container: #f0f0f0;
80
81
  --smrt-color-on-secondary-container: #1f1f1f;
81
-
82
- /* Tertiary */
83
82
  --smrt-color-tertiary: #7c4dff;
84
83
  --smrt-color-on-tertiary: #ffffff;
85
84
  --smrt-color-tertiary-container: #e8ddff;
86
85
  --smrt-color-on-tertiary-container: #1e005f;
87
-
88
- /* Error */
89
86
  --smrt-color-error: #b3261e;
90
87
  --smrt-color-on-error: #ffffff;
91
88
  --smrt-color-error-container: #f9dedc;
92
89
  --smrt-color-on-error-container: #410e0b;
93
-
94
- /* Warning */
95
90
  --smrt-color-warning: #f9ab00;
96
91
  --smrt-color-on-warning: #000000;
97
92
  --smrt-color-warning-container: #fff4d9;
98
93
  --smrt-color-on-warning-container: #3d2a00;
99
-
100
- /* Success */
101
94
  --smrt-color-success: #1e8e3e;
102
95
  --smrt-color-on-success: #ffffff;
103
96
  --smrt-color-success-container: #e6f4ea;
104
97
  --smrt-color-on-success-container: #1e4620;
105
-
106
- /* Surface */
107
98
  --smrt-color-surface: #ffffff;
108
99
  --smrt-color-on-surface: #1f1f1f;
109
100
  --smrt-color-surface-variant: #f2f2f2;
@@ -115,69 +106,220 @@
115
106
  --smrt-color-surface-container-lowest: #ffffff;
116
107
  --smrt-color-surface-dim: #dadce0;
117
108
  --smrt-color-surface-bright: #f8f9fa;
118
-
119
- /* Background */
120
109
  --smrt-color-background: #ffffff;
121
110
  --smrt-color-on-background: #1f1f1f;
122
-
123
- /* Outline */
124
111
  --smrt-color-outline: #747775;
125
112
  --smrt-color-outline-variant: #c4c7c5;
126
-
127
- /* Inverse */
128
113
  --smrt-color-inverse-surface: #303133;
129
114
  --smrt-color-inverse-on-surface: #f2f2f2;
130
115
  --smrt-color-inverse-primary: #a8c7fa;
131
-
132
- /* Effects */
133
116
  --smrt-color-shadow: #000000;
134
117
  --smrt-color-scrim: rgba(0, 0, 0, 0.5);
118
+ --smrt-typography-display-large-size: 3.5rem;
119
+ --smrt-typography-display-large-line-height: 1.1;
120
+ --smrt-typography-display-large-weight: 400;
121
+ --smrt-typography-display-large-tracking: -0.02em;
122
+ --smrt-typography-display-large-font-family: var(--smrt-font-family);
123
+ --smrt-typography-display-large-font: 400 3.5rem/1.1 var(--smrt-font-family);
124
+ --smrt-typography-display-medium-size: 2.75rem;
125
+ --smrt-typography-display-medium-line-height: 1.15;
126
+ --smrt-typography-display-medium-weight: 400;
127
+ --smrt-typography-display-medium-tracking: -0.01em;
128
+ --smrt-typography-display-medium-font-family: var(--smrt-font-family);
129
+ --smrt-typography-display-medium-font: 400 2.75rem/1.15 var(--smrt-font-family);
130
+ --smrt-typography-display-small-size: 2.25rem;
131
+ --smrt-typography-display-small-line-height: 1.2;
132
+ --smrt-typography-display-small-weight: 400;
133
+ --smrt-typography-display-small-tracking: 0;
134
+ --smrt-typography-display-small-font-family: var(--smrt-font-family);
135
+ --smrt-typography-display-small-font: 400 2.25rem/1.2 var(--smrt-font-family);
136
+ --smrt-typography-headline-large-size: 2rem;
137
+ --smrt-typography-headline-large-line-height: 1.25;
138
+ --smrt-typography-headline-large-weight: 400;
139
+ --smrt-typography-headline-large-tracking: 0;
140
+ --smrt-typography-headline-large-font-family: var(--smrt-font-family);
141
+ --smrt-typography-headline-large-font: 400 2rem/1.25 var(--smrt-font-family);
142
+ --smrt-typography-headline-medium-size: 1.75rem;
143
+ --smrt-typography-headline-medium-line-height: 1.3;
144
+ --smrt-typography-headline-medium-weight: 400;
145
+ --smrt-typography-headline-medium-tracking: 0;
146
+ --smrt-typography-headline-medium-font-family: var(--smrt-font-family);
147
+ --smrt-typography-headline-medium-font: 400 1.75rem/1.3 var(--smrt-font-family);
148
+ --smrt-typography-headline-small-size: 1.5rem;
149
+ --smrt-typography-headline-small-line-height: 1.35;
150
+ --smrt-typography-headline-small-weight: 400;
151
+ --smrt-typography-headline-small-tracking: 0;
152
+ --smrt-typography-headline-small-font-family: var(--smrt-font-family);
153
+ --smrt-typography-headline-small-font: 400 1.5rem/1.35 var(--smrt-font-family);
154
+ --smrt-typography-title-large-size: 1.375rem;
155
+ --smrt-typography-title-large-line-height: 1.4;
156
+ --smrt-typography-title-large-weight: 500;
157
+ --smrt-typography-title-large-tracking: 0;
158
+ --smrt-typography-title-large-font-family: var(--smrt-font-family);
159
+ --smrt-typography-title-large-font: 500 1.375rem/1.4 var(--smrt-font-family);
160
+ --smrt-typography-title-medium-size: 1rem;
161
+ --smrt-typography-title-medium-line-height: 1.5;
162
+ --smrt-typography-title-medium-weight: 500;
163
+ --smrt-typography-title-medium-tracking: 0.01em;
164
+ --smrt-typography-title-medium-font-family: var(--smrt-font-family);
165
+ --smrt-typography-title-medium-font: 500 1rem/1.5 var(--smrt-font-family);
166
+ --smrt-typography-title-small-size: 0.875rem;
167
+ --smrt-typography-title-small-line-height: 1.5;
168
+ --smrt-typography-title-small-weight: 500;
169
+ --smrt-typography-title-small-tracking: 0.01em;
170
+ --smrt-typography-title-small-font-family: var(--smrt-font-family);
171
+ --smrt-typography-title-small-font: 500 0.875rem/1.5 var(--smrt-font-family);
172
+ --smrt-typography-body-large-size: 1rem;
173
+ --smrt-typography-body-large-line-height: 1.5;
174
+ --smrt-typography-body-large-weight: 400;
175
+ --smrt-typography-body-large-tracking: 0.03em;
176
+ --smrt-typography-body-large-font-family: var(--smrt-font-family);
177
+ --smrt-typography-body-large-font: 400 1rem/1.5 var(--smrt-font-family);
178
+ --smrt-typography-body-medium-size: 0.875rem;
179
+ --smrt-typography-body-medium-line-height: 1.5;
180
+ --smrt-typography-body-medium-weight: 400;
181
+ --smrt-typography-body-medium-tracking: 0.02em;
182
+ --smrt-typography-body-medium-font-family: var(--smrt-font-family);
183
+ --smrt-typography-body-medium-font: 400 0.875rem/1.5 var(--smrt-font-family);
184
+ --smrt-typography-body-small-size: 0.75rem;
185
+ --smrt-typography-body-small-line-height: 1.4;
186
+ --smrt-typography-body-small-weight: 400;
187
+ --smrt-typography-body-small-tracking: 0.03em;
188
+ --smrt-typography-body-small-font-family: var(--smrt-font-family);
189
+ --smrt-typography-body-small-font: 400 0.75rem/1.4 var(--smrt-font-family);
190
+ --smrt-typography-label-large-size: 0.875rem;
191
+ --smrt-typography-label-large-line-height: 1.4;
192
+ --smrt-typography-label-large-weight: 500;
193
+ --smrt-typography-label-large-tracking: 0.01em;
194
+ --smrt-typography-label-large-font-family: var(--smrt-font-family);
195
+ --smrt-typography-label-large-font: 500 0.875rem/1.4 var(--smrt-font-family);
196
+ --smrt-typography-label-medium-size: 0.75rem;
197
+ --smrt-typography-label-medium-line-height: 1.4;
198
+ --smrt-typography-label-medium-weight: 500;
199
+ --smrt-typography-label-medium-tracking: 0.05em;
200
+ --smrt-typography-label-medium-font-family: var(--smrt-font-family);
201
+ --smrt-typography-label-medium-font: 500 0.75rem/1.4 var(--smrt-font-family);
202
+ --smrt-typography-label-small-size: 0.6875rem;
203
+ --smrt-typography-label-small-line-height: 1.4;
204
+ --smrt-typography-label-small-weight: 500;
205
+ --smrt-typography-label-small-tracking: 0.05em;
206
+ --smrt-typography-label-small-font-family: var(--smrt-font-family);
207
+ --smrt-typography-label-small-font: 500 0.6875rem/1.4 var(--smrt-font-family);
208
+ --smrt-spacing-0: 0;
209
+ --smrt-spacing-1: 0.25rem;
210
+ --smrt-spacing-2: 0.5rem;
211
+ --smrt-spacing-3: 0.75rem;
212
+ --smrt-spacing-4: 1rem;
213
+ --smrt-spacing-5: 1.25rem;
214
+ --smrt-spacing-6: 1.5rem;
215
+ --smrt-spacing-7: 1.75rem;
216
+ --smrt-spacing-8: 2rem;
217
+ --smrt-spacing-9: 2.25rem;
218
+ --smrt-spacing-10: 2.5rem;
219
+ --smrt-spacing-11: 2.75rem;
220
+ --smrt-spacing-12: 3rem;
221
+ --smrt-spacing-14: 3.5rem;
222
+ --smrt-spacing-16: 4rem;
223
+ --smrt-spacing-20: 5rem;
224
+ --smrt-spacing-24: 6rem;
225
+ --smrt-spacing-0_5: 0.125rem;
226
+ --smrt-spacing-1_5: 0.375rem;
227
+ --smrt-spacing-2_5: 0.625rem;
228
+ --smrt-spacing-3_5: 0.875rem;
229
+ --smrt-spacing-xs: 0.25rem;
230
+ --smrt-spacing-sm: 0.5rem;
231
+ --smrt-spacing-md: 1rem;
232
+ --smrt-spacing-lg: 1.5rem;
233
+ --smrt-spacing-xl: 2rem;
234
+ --smrt-spacing-2xl: 3rem;
235
+ --smrt-spacing-3xl: 4rem;
236
+ --smrt-radius-none: 0;
237
+ --smrt-radius-sm: 0.25rem;
238
+ --smrt-radius-md: 0.5rem;
239
+ --smrt-radius-lg: 0.75rem;
240
+ --smrt-radius-xl: 1rem;
241
+ --smrt-radius-2xl: 1.5rem;
242
+ --smrt-radius-3xl: 2rem;
243
+ --smrt-radius-full: 9999px;
244
+ --smrt-radius-extra-small: 0.25rem;
245
+ --smrt-radius-small: 0.25rem;
246
+ --smrt-radius-medium: 0.5rem;
247
+ --smrt-radius-large: 0.75rem;
248
+ --smrt-radius-extra-large: 1rem;
249
+ --smrt-elevation-0: none;
250
+ --smrt-elevation-1: 0 1px 2px 0 rgb(0 0 0 / 0.05), 0 1px 3px 0 rgb(0 0 0 / 0.02);
251
+ --smrt-elevation-2: 0 1px 2px 0 rgb(0 0 0 / 0.06), 0 2px 4px 0 rgb(0 0 0 / 0.04);
252
+ --smrt-elevation-3: 0 2px 4px 0 rgb(0 0 0 / 0.06), 0 4px 8px 0 rgb(0 0 0 / 0.04);
253
+ --smrt-elevation-4: 0 4px 8px 0 rgb(0 0 0 / 0.08), 0 8px 16px 0 rgb(0 0 0 / 0.04);
254
+ --smrt-elevation-5: 0 8px 16px 0 rgb(0 0 0 / 0.1), 0 16px 32px 0 rgb(0 0 0 / 0.04);
255
+ --smrt-duration-instant: 0ms;
256
+ --smrt-duration-fast: 100ms;
257
+ --smrt-duration-normal: 200ms;
258
+ --smrt-duration-slow: 300ms;
259
+ --smrt-duration-slower: 500ms;
260
+ --smrt-duration-short1: 50ms;
261
+ --smrt-duration-short2: 100ms;
262
+ --smrt-duration-short3: 150ms;
263
+ --smrt-duration-short4: 200ms;
264
+ --smrt-duration-medium1: 250ms;
265
+ --smrt-duration-medium2: 300ms;
266
+ --smrt-duration-medium3: 350ms;
267
+ --smrt-duration-medium4: 400ms;
268
+ --smrt-duration-long1: 450ms;
269
+ --smrt-duration-long2: 500ms;
270
+ --smrt-duration-long3: 550ms;
271
+ --smrt-duration-long4: 600ms;
272
+ --smrt-easing-standard: cubic-bezier(0.2, 0, 0, 1);
273
+ --smrt-easing-standard-decelerate: cubic-bezier(0, 0, 0.2, 1);
274
+ --smrt-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
275
+ --smrt-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
276
+ --smrt-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
277
+ --smrt-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
278
+ --smrt-font-family-mono: ui-monospace, "SF Mono", "Monaco", "Cascadia Code", "Consolas", monospace;
279
+ --smrt-typography-weight-normal: 400;
280
+ --smrt-typography-weight-medium: 500;
281
+ --smrt-typography-weight-semibold: 600;
282
+ --smrt-typography-weight-bold: 700;
283
+ --smrt-z-index-dropdown: 1000;
284
+ --smrt-z-index-sticky: 1100;
285
+ --smrt-z-index-overlay: 1200;
286
+ --smrt-z-index-modal: 1300;
287
+ --smrt-z-index-dialog: 1300;
288
+ --smrt-z-index-popover: 1400;
289
+ --smrt-z-index-toast: 1500;
290
+ --smrt-z-index-tooltip: 1600;
291
+ --smrt-z-index-loading: 1700;
292
+ }
135
293
 
136
- /* Theme metadata */
294
+ [data-theme="material"][data-color-scheme="dark"] {
137
295
  --smrt-theme-id: material;
138
296
  --smrt-theme-name: Material;
139
- --smrt-color-scheme: light;
297
+ --smrt-color-scheme: dark;
140
298
  --smrt-font-family: "Google Sans", "Roboto", system-ui, -apple-system, sans-serif;
141
- }
142
-
143
- [data-theme="material"][data-color-scheme="dark"] {
144
- /* Primary */
145
299
  --smrt-color-primary: #a8c7fa;
146
300
  --smrt-color-on-primary: #062e6f;
147
301
  --smrt-color-primary-container: #0842a0;
148
302
  --smrt-color-on-primary-container: #d3e3fd;
149
-
150
- /* Secondary */
151
303
  --smrt-color-secondary: #c7c7c7;
152
304
  --smrt-color-on-secondary: #303133;
153
305
  --smrt-color-secondary-container: #444746;
154
306
  --smrt-color-on-secondary-container: #e3e3e3;
155
-
156
- /* Tertiary */
157
307
  --smrt-color-tertiary: #cbb7ff;
158
308
  --smrt-color-on-tertiary: #3e1e96;
159
309
  --smrt-color-tertiary-container: #5e3fc0;
160
310
  --smrt-color-on-tertiary-container: #e8ddff;
161
-
162
- /* Error */
163
311
  --smrt-color-error: #f2b8b5;
164
312
  --smrt-color-on-error: #601410;
165
313
  --smrt-color-error-container: #8c1d18;
166
314
  --smrt-color-on-error-container: #f9dedc;
167
-
168
- /* Warning */
169
315
  --smrt-color-warning: #ffcd66;
170
316
  --smrt-color-on-warning: #5c3d00;
171
317
  --smrt-color-warning-container: #8a5d00;
172
318
  --smrt-color-on-warning-container: #fff4d9;
173
-
174
- /* Success */
175
319
  --smrt-color-success: #81c995;
176
320
  --smrt-color-on-success: #0d522d;
177
321
  --smrt-color-success-container: #1e4620;
178
322
  --smrt-color-on-success-container: #e6f4ea;
179
-
180
- /* Surface */
181
323
  --smrt-color-surface: #0e0e0e;
182
324
  --smrt-color-on-surface: #e3e3e3;
183
325
  --smrt-color-surface-variant: #1f1f1f;
@@ -189,29 +331,189 @@
189
331
  --smrt-color-surface-container-lowest: #0a0a0a;
190
332
  --smrt-color-surface-dim: #141414;
191
333
  --smrt-color-surface-bright: #2d2d2d;
192
-
193
- /* Background */
194
334
  --smrt-color-background: #0e0e0e;
195
335
  --smrt-color-on-background: #e3e3e3;
196
-
197
- /* Outline */
198
336
  --smrt-color-outline: #8e918f;
199
337
  --smrt-color-outline-variant: #444746;
200
-
201
- /* Inverse */
202
338
  --smrt-color-inverse-surface: #e3e3e3;
203
339
  --smrt-color-inverse-on-surface: #1f1f1f;
204
340
  --smrt-color-inverse-primary: #0b57d0;
205
-
206
- /* Effects */
207
341
  --smrt-color-shadow: #000000;
208
342
  --smrt-color-scrim: rgba(0, 0, 0, 0.7);
209
-
210
- /* Theme metadata */
211
- --smrt-theme-id: material;
212
- --smrt-theme-name: Material;
213
- --smrt-color-scheme: dark;
214
- --smrt-font-family: "Google Sans", "Roboto", system-ui, -apple-system, sans-serif;
343
+ --smrt-typography-display-large-size: 3.5rem;
344
+ --smrt-typography-display-large-line-height: 1.1;
345
+ --smrt-typography-display-large-weight: 400;
346
+ --smrt-typography-display-large-tracking: -0.02em;
347
+ --smrt-typography-display-large-font-family: var(--smrt-font-family);
348
+ --smrt-typography-display-large-font: 400 3.5rem/1.1 var(--smrt-font-family);
349
+ --smrt-typography-display-medium-size: 2.75rem;
350
+ --smrt-typography-display-medium-line-height: 1.15;
351
+ --smrt-typography-display-medium-weight: 400;
352
+ --smrt-typography-display-medium-tracking: -0.01em;
353
+ --smrt-typography-display-medium-font-family: var(--smrt-font-family);
354
+ --smrt-typography-display-medium-font: 400 2.75rem/1.15 var(--smrt-font-family);
355
+ --smrt-typography-display-small-size: 2.25rem;
356
+ --smrt-typography-display-small-line-height: 1.2;
357
+ --smrt-typography-display-small-weight: 400;
358
+ --smrt-typography-display-small-tracking: 0;
359
+ --smrt-typography-display-small-font-family: var(--smrt-font-family);
360
+ --smrt-typography-display-small-font: 400 2.25rem/1.2 var(--smrt-font-family);
361
+ --smrt-typography-headline-large-size: 2rem;
362
+ --smrt-typography-headline-large-line-height: 1.25;
363
+ --smrt-typography-headline-large-weight: 400;
364
+ --smrt-typography-headline-large-tracking: 0;
365
+ --smrt-typography-headline-large-font-family: var(--smrt-font-family);
366
+ --smrt-typography-headline-large-font: 400 2rem/1.25 var(--smrt-font-family);
367
+ --smrt-typography-headline-medium-size: 1.75rem;
368
+ --smrt-typography-headline-medium-line-height: 1.3;
369
+ --smrt-typography-headline-medium-weight: 400;
370
+ --smrt-typography-headline-medium-tracking: 0;
371
+ --smrt-typography-headline-medium-font-family: var(--smrt-font-family);
372
+ --smrt-typography-headline-medium-font: 400 1.75rem/1.3 var(--smrt-font-family);
373
+ --smrt-typography-headline-small-size: 1.5rem;
374
+ --smrt-typography-headline-small-line-height: 1.35;
375
+ --smrt-typography-headline-small-weight: 400;
376
+ --smrt-typography-headline-small-tracking: 0;
377
+ --smrt-typography-headline-small-font-family: var(--smrt-font-family);
378
+ --smrt-typography-headline-small-font: 400 1.5rem/1.35 var(--smrt-font-family);
379
+ --smrt-typography-title-large-size: 1.375rem;
380
+ --smrt-typography-title-large-line-height: 1.4;
381
+ --smrt-typography-title-large-weight: 500;
382
+ --smrt-typography-title-large-tracking: 0;
383
+ --smrt-typography-title-large-font-family: var(--smrt-font-family);
384
+ --smrt-typography-title-large-font: 500 1.375rem/1.4 var(--smrt-font-family);
385
+ --smrt-typography-title-medium-size: 1rem;
386
+ --smrt-typography-title-medium-line-height: 1.5;
387
+ --smrt-typography-title-medium-weight: 500;
388
+ --smrt-typography-title-medium-tracking: 0.01em;
389
+ --smrt-typography-title-medium-font-family: var(--smrt-font-family);
390
+ --smrt-typography-title-medium-font: 500 1rem/1.5 var(--smrt-font-family);
391
+ --smrt-typography-title-small-size: 0.875rem;
392
+ --smrt-typography-title-small-line-height: 1.5;
393
+ --smrt-typography-title-small-weight: 500;
394
+ --smrt-typography-title-small-tracking: 0.01em;
395
+ --smrt-typography-title-small-font-family: var(--smrt-font-family);
396
+ --smrt-typography-title-small-font: 500 0.875rem/1.5 var(--smrt-font-family);
397
+ --smrt-typography-body-large-size: 1rem;
398
+ --smrt-typography-body-large-line-height: 1.5;
399
+ --smrt-typography-body-large-weight: 400;
400
+ --smrt-typography-body-large-tracking: 0.03em;
401
+ --smrt-typography-body-large-font-family: var(--smrt-font-family);
402
+ --smrt-typography-body-large-font: 400 1rem/1.5 var(--smrt-font-family);
403
+ --smrt-typography-body-medium-size: 0.875rem;
404
+ --smrt-typography-body-medium-line-height: 1.5;
405
+ --smrt-typography-body-medium-weight: 400;
406
+ --smrt-typography-body-medium-tracking: 0.02em;
407
+ --smrt-typography-body-medium-font-family: var(--smrt-font-family);
408
+ --smrt-typography-body-medium-font: 400 0.875rem/1.5 var(--smrt-font-family);
409
+ --smrt-typography-body-small-size: 0.75rem;
410
+ --smrt-typography-body-small-line-height: 1.4;
411
+ --smrt-typography-body-small-weight: 400;
412
+ --smrt-typography-body-small-tracking: 0.03em;
413
+ --smrt-typography-body-small-font-family: var(--smrt-font-family);
414
+ --smrt-typography-body-small-font: 400 0.75rem/1.4 var(--smrt-font-family);
415
+ --smrt-typography-label-large-size: 0.875rem;
416
+ --smrt-typography-label-large-line-height: 1.4;
417
+ --smrt-typography-label-large-weight: 500;
418
+ --smrt-typography-label-large-tracking: 0.01em;
419
+ --smrt-typography-label-large-font-family: var(--smrt-font-family);
420
+ --smrt-typography-label-large-font: 500 0.875rem/1.4 var(--smrt-font-family);
421
+ --smrt-typography-label-medium-size: 0.75rem;
422
+ --smrt-typography-label-medium-line-height: 1.4;
423
+ --smrt-typography-label-medium-weight: 500;
424
+ --smrt-typography-label-medium-tracking: 0.05em;
425
+ --smrt-typography-label-medium-font-family: var(--smrt-font-family);
426
+ --smrt-typography-label-medium-font: 500 0.75rem/1.4 var(--smrt-font-family);
427
+ --smrt-typography-label-small-size: 0.6875rem;
428
+ --smrt-typography-label-small-line-height: 1.4;
429
+ --smrt-typography-label-small-weight: 500;
430
+ --smrt-typography-label-small-tracking: 0.05em;
431
+ --smrt-typography-label-small-font-family: var(--smrt-font-family);
432
+ --smrt-typography-label-small-font: 500 0.6875rem/1.4 var(--smrt-font-family);
433
+ --smrt-spacing-0: 0;
434
+ --smrt-spacing-1: 0.25rem;
435
+ --smrt-spacing-2: 0.5rem;
436
+ --smrt-spacing-3: 0.75rem;
437
+ --smrt-spacing-4: 1rem;
438
+ --smrt-spacing-5: 1.25rem;
439
+ --smrt-spacing-6: 1.5rem;
440
+ --smrt-spacing-7: 1.75rem;
441
+ --smrt-spacing-8: 2rem;
442
+ --smrt-spacing-9: 2.25rem;
443
+ --smrt-spacing-10: 2.5rem;
444
+ --smrt-spacing-11: 2.75rem;
445
+ --smrt-spacing-12: 3rem;
446
+ --smrt-spacing-14: 3.5rem;
447
+ --smrt-spacing-16: 4rem;
448
+ --smrt-spacing-20: 5rem;
449
+ --smrt-spacing-24: 6rem;
450
+ --smrt-spacing-0_5: 0.125rem;
451
+ --smrt-spacing-1_5: 0.375rem;
452
+ --smrt-spacing-2_5: 0.625rem;
453
+ --smrt-spacing-3_5: 0.875rem;
454
+ --smrt-spacing-xs: 0.25rem;
455
+ --smrt-spacing-sm: 0.5rem;
456
+ --smrt-spacing-md: 1rem;
457
+ --smrt-spacing-lg: 1.5rem;
458
+ --smrt-spacing-xl: 2rem;
459
+ --smrt-spacing-2xl: 3rem;
460
+ --smrt-spacing-3xl: 4rem;
461
+ --smrt-radius-none: 0;
462
+ --smrt-radius-sm: 0.25rem;
463
+ --smrt-radius-md: 0.5rem;
464
+ --smrt-radius-lg: 0.75rem;
465
+ --smrt-radius-xl: 1rem;
466
+ --smrt-radius-2xl: 1.5rem;
467
+ --smrt-radius-3xl: 2rem;
468
+ --smrt-radius-full: 9999px;
469
+ --smrt-radius-extra-small: 0.25rem;
470
+ --smrt-radius-small: 0.25rem;
471
+ --smrt-radius-medium: 0.5rem;
472
+ --smrt-radius-large: 0.75rem;
473
+ --smrt-radius-extra-large: 1rem;
474
+ --smrt-elevation-0: none;
475
+ --smrt-elevation-1: 0 1px 2px 0 rgb(0 0 0 / 0.05), 0 1px 3px 0 rgb(0 0 0 / 0.02);
476
+ --smrt-elevation-2: 0 1px 2px 0 rgb(0 0 0 / 0.06), 0 2px 4px 0 rgb(0 0 0 / 0.04);
477
+ --smrt-elevation-3: 0 2px 4px 0 rgb(0 0 0 / 0.06), 0 4px 8px 0 rgb(0 0 0 / 0.04);
478
+ --smrt-elevation-4: 0 4px 8px 0 rgb(0 0 0 / 0.08), 0 8px 16px 0 rgb(0 0 0 / 0.04);
479
+ --smrt-elevation-5: 0 8px 16px 0 rgb(0 0 0 / 0.1), 0 16px 32px 0 rgb(0 0 0 / 0.04);
480
+ --smrt-duration-instant: 0ms;
481
+ --smrt-duration-fast: 100ms;
482
+ --smrt-duration-normal: 200ms;
483
+ --smrt-duration-slow: 300ms;
484
+ --smrt-duration-slower: 500ms;
485
+ --smrt-duration-short1: 50ms;
486
+ --smrt-duration-short2: 100ms;
487
+ --smrt-duration-short3: 150ms;
488
+ --smrt-duration-short4: 200ms;
489
+ --smrt-duration-medium1: 250ms;
490
+ --smrt-duration-medium2: 300ms;
491
+ --smrt-duration-medium3: 350ms;
492
+ --smrt-duration-medium4: 400ms;
493
+ --smrt-duration-long1: 450ms;
494
+ --smrt-duration-long2: 500ms;
495
+ --smrt-duration-long3: 550ms;
496
+ --smrt-duration-long4: 600ms;
497
+ --smrt-easing-standard: cubic-bezier(0.2, 0, 0, 1);
498
+ --smrt-easing-standard-decelerate: cubic-bezier(0, 0, 0.2, 1);
499
+ --smrt-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
500
+ --smrt-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
501
+ --smrt-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
502
+ --smrt-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
503
+ --smrt-font-family-mono: ui-monospace, "SF Mono", "Monaco", "Cascadia Code", "Consolas", monospace;
504
+ --smrt-typography-weight-normal: 400;
505
+ --smrt-typography-weight-medium: 500;
506
+ --smrt-typography-weight-semibold: 600;
507
+ --smrt-typography-weight-bold: 700;
508
+ --smrt-z-index-dropdown: 1000;
509
+ --smrt-z-index-sticky: 1100;
510
+ --smrt-z-index-overlay: 1200;
511
+ --smrt-z-index-modal: 1300;
512
+ --smrt-z-index-dialog: 1300;
513
+ --smrt-z-index-popover: 1400;
514
+ --smrt-z-index-toast: 1500;
515
+ --smrt-z-index-tooltip: 1600;
516
+ --smrt-z-index-loading: 1700;
215
517
  }
216
518
 
217
519
  /*
@@ -18,7 +18,7 @@
18
18
 
19
19
  [data-theme="smrt"][data-color-scheme="light"] {
20
20
  --smrt-theme-id: smrt;
21
- --smrt-theme-name: SMRT;
21
+ --smrt-theme-name: s-m-r-t;
22
22
  --smrt-color-scheme: light;
23
23
  --smrt-font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
24
24
  --smrt-color-primary: #e35d12;
@@ -58,7 +58,7 @@
58
58
  --smrt-color-surface-bright: #ffffff;
59
59
  --smrt-color-background: #edeff2;
60
60
  --smrt-color-on-background: #14171c;
61
- --smrt-color-outline: #c6ccd4;
61
+ --smrt-color-outline: #7c7f85;
62
62
  --smrt-color-outline-variant: #dfe3e8;
63
63
  --smrt-color-inverse-surface: #14171c;
64
64
  --smrt-color-inverse-on-surface: #f4f6f8;
@@ -243,7 +243,7 @@
243
243
 
244
244
  [data-theme="smrt"][data-color-scheme="dark"] {
245
245
  --smrt-theme-id: smrt;
246
- --smrt-theme-name: SMRT;
246
+ --smrt-theme-name: s-m-r-t;
247
247
  --smrt-color-scheme: dark;
248
248
  --smrt-font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
249
249
  --smrt-color-primary: #ff7a1a;
@@ -283,7 +283,7 @@
283
283
  --smrt-color-surface-bright: #23272e;
284
284
  --smrt-color-background: #0b0c0e;
285
285
  --smrt-color-on-background: #c9cdd3;
286
- --smrt-color-outline: #333842;
286
+ --smrt-color-outline: #70747b;
287
287
  --smrt-color-outline-variant: #23272e;
288
288
  --smrt-color-inverse-surface: #edeff2;
289
289
  --smrt-color-inverse-on-surface: #14171c;