@kupola/kupola 1.9.7 → 1.9.8

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 (16) hide show
  1. package/css/kupola.css +14 -14
  2. package/dist/core.cjs.js +1 -1
  3. package/dist/core.esm.js +106 -1
  4. package/dist/css/dashboard.css +368 -0
  5. package/dist/css/kupola.css +14 -13
  6. package/dist/css/scaffold.css +2 -9
  7. package/dist/css/theme-dark.css +340 -214
  8. package/dist/kupola.cjs.js +1 -1
  9. package/dist/kupola.css +57 -14
  10. package/dist/kupola.esm.js +9965 -1
  11. package/dist/kupola.min.css +1 -1
  12. package/dist/plugins/vite-plugin-kupola.js +1 -1
  13. package/dist/plugins/webpack-plugin-kupola.js +1 -1
  14. package/dist/theme-preload.js +7 -28
  15. package/package.json +1 -1
  16. package/scripts/build-css.cjs +48 -0
package/dist/css/theme-dark.css CHANGED
@@ -1,215 +1,341 @@
1
- /* ===== Dark Theme (Default) ===== */
2
-
3
- :root {
4
- --bg-base-default: #0C0C0D;
5
- --bg-base-secondary: #1A1B1D;
6
- --bg-base-tertiary: #222427;
7
- --bg-overlay-l1: rgba(255, 255, 255, 0.04);
8
- --bg-overlay-l2: rgba(255, 255, 255, 0.06);
9
- --bg-overlay-l3: rgba(255, 255, 255, 0.08);
10
- --bg-overlay-l4: rgba(255, 255, 255, 0.12);
11
- --bg-menu: #1A1B1D;
12
- --bg-tooltip: #1A1B1D;
13
- --bg-invert: #FFFFFF;
14
- --bg-invert-hover: #F5F5F5;
15
- --bg-invert-active: #E5E5E5;
16
- --bg-invert-disabled: rgba(255, 255, 255, 0.2);
17
-
18
- --special-bgtabsoverlay: rgba(0, 0, 0, 0.2);
19
-
20
- --text-default: #E5E7EB;
21
- --text-default-hover: #FFFFFF;
22
- --text-default-active: #FFFFFF;
23
- --text-secondary: #B8BDCA;
24
- --text-secondary-hover: #E5E7EB;
25
- --text-secondary-active: #E5E7EB;
26
- --text-tertiary: #9CA3AF;
27
- --text-disabled: #8B93A1;
28
- --text-onbrand: #FFFFFF;
29
- --text-onaccent: #FFFFFF;
30
-
31
- --icon-default: #E5E7EB;
32
- --icon-default-hover: #FFFFFF;
33
- --icon-default-active: #FFFFFF;
34
- --icon-secondary: #B8BDCA;
35
- --icon-secondary-hover: #E5E7EB;
36
- --icon-secondary-active: #E5E7EB;
37
- --icon-tertiary: #9CA3AF;
38
- --icon-disabled: #8B93A1;
39
- --icon-onbrand: #FFFFFF;
40
- --icon-onaccent: #FFFFFF;
41
-
42
- --border-neutral-l1: rgba(255, 255, 255, 0.12);
43
- --border-neutral-l2: rgba(255, 255, 255, 0.18);
44
- --border-neutral-l3: rgba(255, 255, 255, 0.25);
45
- --border-contrast: #0C0C0D;
46
-
47
- --bg-brand-popup: rgba(83, 81, 100, 0.15);
48
-
49
- --code-text: #D1D3DB;
50
- --code-doc: #9599A6;
51
- --code-keyword: #D1D3DB;
52
- --code-string: #32F08C;
53
- --code-function: #79B8FF;
54
- --code-number: #FFAD5B;
55
- --code-comment: #8B93A1;
56
- --code-variable: #D1D3DB;
57
- --code-type: #FFAD5B;
58
-
59
- --status-success-default: #32F08C;
60
- --status-success-hover: #32F08C;
61
- --status-success-active: #32F08C;
62
- --status-success-disabled: rgba(50, 240, 140, 0.5);
63
-
64
- --status-warning-default: #FFAD5B;
65
- --status-warning-hover: #FFAD5B;
66
- --status-warning-active: #FFAD5B;
67
- --status-warning-disabled: rgba(255, 173, 91, 0.5);
68
-
69
- --status-error-default: #FF9CA8;
70
- --status-error-hover: #FF9CA8;
71
- --status-error-active: #FF9CA8;
72
- --status-error-disabled: rgba(255, 156, 168, 0.5);
73
-
74
- --status-info-default: #79B8FF;
75
- --status-info-hover: #79B8FF;
76
- --status-info-active: #79B8FF;
77
- --status-info-disabled: rgba(121, 184, 255, 0.5);
78
-
79
- --bg-brand: #79B8FF;
80
- --bg-brand-hover: #79B8FF;
81
- --bg-brand-active: #79B8FF;
82
- --bg-brand-disabled: rgba(121, 184, 255, 0.5);
83
-
84
- --border-brand: rgba(121, 184, 255, 0.5);
85
-
86
- --bg-accent: #79B8FF;
87
- --bg-accent-hover: #79B8FF;
88
- --bg-accent-active: #79B8FF;
89
- --bg-accent-disabled: rgba(121, 184, 255, 0.5);
90
-
91
- --border-accent: rgba(121, 184, 255, 0.5);
92
-
93
- --text-brand: #79B8FF;
94
- --text-brand-hover: #79B8FF;
95
- --text-brand-active: #79B8FF;
96
-
97
- --text-accent: #79B8FF;
98
- --text-accent-hover: #79B8FF;
99
- --text-accent-active: #79B8FF;
100
-
101
- --icon-brand: #79B8FF;
102
- --icon-brand-hover: #79B8FF;
103
- --icon-brand-active: #79B8FF;
104
-
105
- --icon-accent: #79B8FF;
106
- --icon-accent-hover: #79B8FF;
107
- --icon-accent-active: #79B8FF;
108
- }
109
-
110
- [data-theme="dark"] {
111
- --bg-base-default: #0C0C0D;
112
- --bg-base-secondary: #1A1B1D;
113
- --bg-base-tertiary: #222427;
114
- --bg-overlay-l1: rgba(255, 255, 255, 0.04);
115
- --bg-overlay-l2: rgba(255, 255, 255, 0.06);
116
- --bg-overlay-l3: rgba(255, 255, 255, 0.08);
117
- --bg-overlay-l4: rgba(255, 255, 255, 0.12);
118
- --bg-menu: #1A1B1D;
119
- --bg-tooltip: #1A1B1D;
120
- --bg-invert: #FFFFFF;
121
- --bg-invert-hover: #F5F5F5;
122
- --bg-invert-active: #E5E5E5;
123
- --bg-invert-disabled: rgba(255, 255, 255, 0.2);
124
-
125
- --special-bgtabsoverlay: rgba(0, 0, 0, 0.2);
126
-
127
- --text-default: #E5E7EB;
128
- --text-default-hover: #FFFFFF;
129
- --text-default-active: #FFFFFF;
130
- --text-secondary: #B8BDCA;
131
- --text-secondary-hover: #E5E7EB;
132
- --text-secondary-active: #E5E7EB;
133
- --text-tertiary: #9CA3AF;
134
- --text-disabled: #8B93A1;
135
- --text-onbrand: #FFFFFF;
136
- --text-onaccent: #FFFFFF;
137
-
138
- --icon-default: #E5E7EB;
139
- --icon-default-hover: #FFFFFF;
140
- --icon-default-active: #FFFFFF;
141
- --icon-secondary: #B8BDCA;
142
- --icon-secondary-hover: #E5E7EB;
143
- --icon-secondary-active: #E5E7EB;
144
- --icon-tertiary: #9CA3AF;
145
- --icon-disabled: #8B93A1;
146
- --icon-onbrand: #FFFFFF;
147
- --icon-onaccent: #FFFFFF;
148
-
149
- --border-neutral-l1: rgba(255, 255, 255, 0.12);
150
- --border-neutral-l2: rgba(255, 255, 255, 0.18);
151
- --border-neutral-l3: rgba(255, 255, 255, 0.25);
152
- --border-contrast: #0C0C0D;
153
-
154
- --bg-brand-popup: rgba(83, 81, 100, 0.15);
155
-
156
- --code-text: #D1D3DB;
157
- --code-doc: #9599A6;
158
- --code-keyword: #D1D3DB;
159
- --code-string: #32F08C;
160
- --code-function: #79B8FF;
161
- --code-number: #FFAD5B;
162
- --code-comment: #8B93A1;
163
- --code-variable: #D1D3DB;
164
- --code-type: #FFAD5B;
165
-
166
- --status-success-default: #32F08C;
167
- --status-success-hover: #32F08C;
168
- --status-success-active: #32F08C;
169
- --status-success-disabled: rgba(50, 240, 140, 0.5);
170
-
171
- --status-warning-default: #FFAD5B;
172
- --status-warning-hover: #FFAD5B;
173
- --status-warning-active: #FFAD5B;
174
- --status-warning-disabled: rgba(255, 173, 91, 0.5);
175
-
176
- --status-error-default: #FF9CA8;
177
- --status-error-hover: #FF9CA8;
178
- --status-error-active: #FF9CA8;
179
- --status-error-disabled: rgba(255, 156, 168, 0.5);
180
-
181
- --status-info-default: #79B8FF;
182
- --status-info-hover: #79B8FF;
183
- --status-info-active: #79B8FF;
184
- --status-info-disabled: rgba(121, 184, 255, 0.5);
185
-
186
- --bg-brand: #79B8FF;
187
- --bg-brand-hover: #79B8FF;
188
- --bg-brand-active: #79B8FF;
189
- --bg-brand-disabled: rgba(121, 184, 255, 0.5);
190
-
191
- --border-brand: rgba(121, 184, 255, 0.5);
192
-
193
- --bg-accent: #79B8FF;
194
- --bg-accent-hover: #79B8FF;
195
- --bg-accent-active: #79B8FF;
196
- --bg-accent-disabled: rgba(121, 184, 255, 0.5);
197
-
198
- --border-accent: rgba(121, 184, 255, 0.5);
199
-
200
- --text-brand: #79B8FF;
201
- --text-brand-hover: #79B8FF;
202
- --text-brand-active: #79B8FF;
203
-
204
- --text-accent: #79B8FF;
205
- --text-accent-hover: #79B8FF;
206
- --text-accent-active: #79B8FF;
207
-
208
- --icon-brand: #79B8FF;
209
- --icon-brand-hover: #79B8FF;
210
- --icon-brand-active: #79B8FF;
211
-
212
- --icon-accent: #79B8FF;
213
- --icon-accent-hover: #79B8FF;
214
- --icon-accent-active: #79B8FF;
1
+ /* ===== Dark Theme (Default) ===== */
2
+
3
+ :root {
4
+ --bg-base-default: #0C0C0D;
5
+ --bg-base-secondary: #1A1B1D;
6
+ --bg-base-tertiary: #222427;
7
+ --bg-overlay-l1: rgba(255, 255, 255, 0.04);
8
+ --bg-overlay-l2: rgba(255, 255, 255, 0.06);
9
+ --bg-overlay-l3: rgba(255, 255, 255, 0.08);
10
+ --bg-overlay-l4: rgba(255, 255, 255, 0.12);
11
+ --bg-menu: #1A1B1D;
12
+ --bg-tooltip: #1A1B1D;
13
+ --bg-invert: #FFFFFF;
14
+ --bg-invert-hover: #F5F5F5;
15
+ --bg-invert-active: #E5E5E5;
16
+ --bg-invert-disabled: rgba(255, 255, 255, 0.2);
17
+ --special-bgtabsoverlay: rgba(0, 0, 0, 0.2);
18
+ --text-default: #E5E7EB;
19
+ --text-default-hover: #FFFFFF;
20
+ --text-default-active: #FFFFFF;
21
+ --text-secondary: #B8BDCA;
22
+ --text-secondary-hover: #E5E7EB;
23
+ --text-secondary-active: #E5E7EB;
24
+ --text-tertiary: #9CA3AF;
25
+ --text-disabled: #8B93A1;
26
+ --text-onbrand: #FFFFFF;
27
+ --text-onaccent: #FFFFFF;
28
+ --icon-default: #E5E7EB;
29
+ --icon-default-hover: #FFFFFF;
30
+ --icon-default-active: #FFFFFF;
31
+ --icon-secondary: #B8BDCA;
32
+ --icon-secondary-hover: #E5E7EB;
33
+ --icon-secondary-active: #E5E7EB;
34
+ --icon-tertiary: #9CA3AF;
35
+ --icon-disabled: #8B93A1;
36
+ --icon-onbrand: #FFFFFF;
37
+ --icon-onaccent: #FFFFFF;
38
+ --border-neutral-l1: rgba(255, 255, 255, 0.12);
39
+ --border-neutral-l2: rgba(255, 255, 255, 0.18);
40
+ --border-neutral-l3: rgba(255, 255, 255, 0.25);
41
+ --border-contrast: #0C0C0D;
42
+ --bg-brand-popup: rgba(83, 81, 100, 0.15);
43
+ --icon-filter: brightness(0) saturate(0) invert(0.9);
44
+ }
45
+
46
+ [data-theme="dark"] {
47
+ --bg-base-default: #0C0C0D;
48
+ --bg-base-secondary: #1A1B1D;
49
+ --bg-base-tertiary: #222427;
50
+ --bg-overlay-l1: rgba(255, 255, 255, 0.04);
51
+ --bg-overlay-l2: rgba(255, 255, 255, 0.06);
52
+ --bg-overlay-l3: rgba(255, 255, 255, 0.08);
53
+ --bg-overlay-l4: rgba(255, 255, 255, 0.12);
54
+ --bg-menu: #1A1B1D;
55
+ --bg-tooltip: #1A1B1D;
56
+ --bg-invert: #FFFFFF;
57
+ --bg-invert-hover: #F5F5F5;
58
+ --bg-invert-active: #E5E5E5;
59
+ --bg-invert-disabled: rgba(255, 255, 255, 0.2);
60
+
61
+ --special-bgtabsoverlay: rgba(0, 0, 0, 0.2);
62
+
63
+ --text-default: #E5E7EB;
64
+ --text-default-hover: #FFFFFF;
65
+ --text-default-active: #FFFFFF;
66
+ --text-secondary: #B8BDCA;
67
+ --text-secondary-hover: #E5E7EB;
68
+ --text-secondary-active: #E5E7EB;
69
+ --text-tertiary: #9CA3AF;
70
+ --text-disabled: #8B93A1;
71
+ --text-onbrand: #FFFFFF;
72
+ --text-onaccent: #FFFFFF;
73
+
74
+ --icon-default: #E5E7EB;
75
+ --icon-default-hover: #FFFFFF;
76
+ --icon-default-active: #FFFFFF;
77
+ --icon-secondary: #B8BDCA;
78
+ --icon-secondary-hover: #E5E7EB;
79
+ --icon-secondary-active: #E5E7EB;
80
+ --icon-tertiary: #9CA3AF;
81
+ --icon-disabled: #8B93A1;
82
+ --icon-onbrand: #FFFFFF;
83
+ --icon-onaccent: #FFFFFF;
84
+
85
+ --border-neutral-l1: rgba(255, 255, 255, 0.12);
86
+ --border-neutral-l2: rgba(255, 255, 255, 0.18);
87
+ --border-neutral-l3: rgba(255, 255, 255, 0.25);
88
+ --border-contrast: #0C0C0D;
89
+
90
+ --bg-brand-popup: rgba(83, 81, 100, 0.15);
91
+
92
+ --code-text: #D1D3DB;
93
+ --code-doc: #9599A6;
94
+ --code-link: #79B8FF;
95
+ --code-number: #FF9CA8;
96
+ --code-action: #D3ADF7;
97
+ --code-instruction: #B37FEB;
98
+ --code-function: #FFAD5B;
99
+ --code-constant: #61AFEF;
100
+ --code-parameter: #98C379;
101
+ --code-attribute: #E5C07B;
102
+ --code-tag: #E06C75;
103
+
104
+ --accent-teal: #32F08C;
105
+ --accent-coral: #FF9CA8;
106
+ --accent-amber: #FFAD5B;
107
+ --accent-lime: #A6EA39;
108
+ --accent-cyan: #78F2F2;
109
+ --accent-blue: #79B8FF;
110
+ --accent-magenta: #FB9DD7;
111
+ --accent-violet: #D3ADF7;
112
+ --accent-slate: #859EAD;
113
+
114
+ --color-background: var(--bg-base-default);
115
+ --color-surface: var(--bg-base-secondary);
116
+ --color-surface-variant: var(--bg-base-tertiary);
117
+ --color-overlay-1: var(--bg-overlay-l1);
118
+ --color-overlay-2: var(--bg-overlay-l2);
119
+ --color-overlay-3: var(--bg-overlay-l3);
120
+ --color-overlay-4: var(--bg-overlay-l4);
121
+ --color-card: var(--bg-base-secondary);
122
+ --color-tooltip: var(--bg-tooltip);
123
+ --color-menu: var(--bg-menu);
124
+ --color-foreground: var(--text-default);
125
+ --color-foreground-hover: var(--text-default-hover);
126
+ --color-on-surface: var(--text-default);
127
+ --color-on-surface-variant: var(--text-secondary);
128
+ --color-muted-foreground: var(--text-secondary);
129
+ --color-disabled-foreground: var(--text-disabled);
130
+ --color-on-primary: var(--text-onbrand);
131
+ --color-border: var(--border-neutral-l1);
132
+ --color-border-strong: var(--border-neutral-l2);
133
+ --color-border-stronger: var(--border-neutral-l3);
134
+ --color-border-contrast: var(--border-contrast);
135
+ --color-outline: var(--border-neutral-l1);
136
+
137
+ --status-primary-default: #79B8FF;
138
+ --status-primary-hover: #A3CFFF;
139
+ --status-primary-active: #4FA3E8;
140
+ --status-primary-surface-l1: rgba(121, 184, 255, 0.12);
141
+ --status-primary-surface-l2: rgba(121, 184, 255, 0.18);
142
+ --status-primary-surface-l3: rgba(121, 184, 255, 0.24);
143
+ --status-info-default: #78F2F2;
144
+ --status-info-hover: #A5FFFF;
145
+ --status-info-active: #4FE5E5;
146
+ --status-info-surface-l1: rgba(120, 242, 242, 0.15);
147
+ --status-info-surface-l2: rgba(120, 242, 242, 0.22);
148
+ --status-info-surface-l3: rgba(120, 242, 242, 0.3);
149
+
150
+ --status-success-default: #32F08C;
151
+ --status-success-hover: #53F4A2;
152
+ --status-success-active: #22D678;
153
+ --status-success-surface-l1: rgba(50, 240, 140, 0.12);
154
+ --status-success-surface-l2: rgba(50, 240, 140, 0.18);
155
+ --status-success-surface-l3: rgba(50, 240, 140, 0.24);
156
+
157
+ --status-warning-default: #FFAD5B;
158
+ --status-warning-hover: #FFC080;
159
+ --status-warning-active: #E0954A;
160
+ --status-warning-surface-l1: rgba(255, 173, 91, 0.12);
161
+ --status-warning-surface-l2: rgba(255, 173, 91, 0.18);
162
+ --status-warning-surface-l3: rgba(255, 173, 91, 0.24);
163
+
164
+ --status-error-default: #FF9CA8;
165
+ --status-error-hover: #FFB8C0;
166
+ --status-error-active: #E07E88;
167
+ --status-error-surface-l1: rgba(255, 156, 168, 0.12);
168
+ --status-error-surface-l2: rgba(255, 156, 168, 0.18);
169
+ --status-error-surface-l3: rgba(255, 156, 168, 0.24);
170
+
171
+ --status-alert-default: #FFAD5B;
172
+ --status-alert-hover: #FFC080;
173
+ --status-alert-active: #E0954A;
174
+ --status-alert-surface-l1: rgba(255, 173, 91, 0.12);
175
+ --status-alert-surface-l2: rgba(255, 173, 91, 0.18);
176
+ --status-alert-surface-l3: rgba(255, 173, 91, 0.24);
177
+
178
+ --brand-green-100: #0A3A22;
179
+ --brand-green-200: #0F5A32;
180
+ --brand-green-300: #147A42;
181
+ --brand-green-400: #199A52;
182
+ --brand-green-500: #32F08C;
183
+ --brand-green-600: #53F4A2;
184
+ --brand-green-700: #74F7B8;
185
+ --brand-green-800: #95FBCE;
186
+ --brand-green-900: #B6FFE4;
187
+ --brand-green-1000: #D7FFF9;
188
+
189
+ --brand-red-100: #4D0000;
190
+ --brand-red-200: #8F0505;
191
+ --brand-red-300: #CB1010;
192
+ --brand-red-400: #E63737;
193
+ --brand-red-500: #FF6464;
194
+ --brand-red-600: #FF8080;
195
+ --brand-red-700: #FF9999;
196
+ --brand-red-800: #FFB3B3;
197
+ --brand-red-900: #FFCCCC;
198
+ --brand-red-1000: #FFE6E6;
199
+
200
+ --brand-yellow-100: #4D3000;
201
+ --brand-yellow-200: #8F5C05;
202
+ --brand-yellow-300: #CB8710;
203
+ --brand-yellow-400: #E6A637;
204
+ --brand-yellow-500: #FFD080;
205
+ --brand-yellow-600: #FFDA99;
206
+ --brand-yellow-700: #FFE3B2;
207
+ --brand-yellow-800: #FFECCC;
208
+ --brand-yellow-900: #FFF6E5;
209
+ --brand-yellow-1000: #FFFDF0;
210
+
211
+ --brand-blue-100: #00284D;
212
+ --brand-blue-200: #054C8F;
213
+ --brand-blue-300: #1071CB;
214
+ --brand-blue-400: #3792E6;
215
+ --brand-blue-500: #64B4FF;
216
+ --brand-blue-600: #80C1FF;
217
+ --brand-blue-700: #99CEFF;
218
+ --brand-blue-800: #B2DAFF;
219
+ --brand-blue-900: #CCE6FF;
220
+ --brand-blue-1000: #E5F3FF;
221
+
222
+ --brand-purple-100: #09004D;
223
+ --brand-purple-200: #15058F;
224
+ --brand-purple-300: #2610CB;
225
+ --brand-purple-400: #4C37E6;
226
+ --brand-purple-500: #7864FF;
227
+ --brand-purple-600: #8E80FF;
228
+ --brand-purple-700: #A599FF;
229
+ --brand-purple-800: #BBB2FF;
230
+ --brand-purple-900: #D2CCFF;
231
+ --brand-purple-1000: #E8E5FF;
232
+
233
+ --brand-gray-100: #030712;
234
+ --brand-gray-200: #111827;
235
+ --brand-gray-300: #1F2937;
236
+ --brand-gray-400: #374151;
237
+ --brand-gray-500: #4B5563;
238
+ --brand-gray-600: #6B7280;
239
+ --brand-gray-700: #9CA3AF;
240
+ --brand-gray-800: #D1D5DB;
241
+ --brand-gray-900: #E5E7EB;
242
+ --brand-gray-1000: #F3F4F6;
243
+
244
+ --viz-graph-bg: #1A1B1D;
245
+ --viz-graph-line: rgba(255, 255, 255, 0.08);
246
+ --viz-series-1: #32F08C;
247
+ --viz-series-2: #79B8FF;
248
+ --viz-series-3: #D3ADF7;
249
+ --viz-series-4: #FFAD5B;
250
+ --viz-series-5: #FB9DD7;
251
+ --viz-series-6: #78F2F2;
252
+
253
+ --border-brand: rgba(83, 81, 100, 0.4);
254
+ --border-brand-hover: rgba(83, 81, 100, 0.6);
255
+ --border-brand-active: rgba(83, 81, 100, 0.8);
256
+
257
+ --bg-brand: #535164;
258
+ --bg-brand-hover: #636174;
259
+ --bg-brand-disabled: rgba(83, 81, 100, 0.3);
260
+ --bg-brand-overlay: rgba(83, 81, 100, 0.12);
261
+
262
+ --bg-error-default: #FF9CA8;
263
+ --bg-warning-default: #FFAD5B;
264
+ --bg-success-default: #32F08C;
265
+
266
+ --text-brand: #636174;
267
+ --text-brand-hover: #737184;
268
+ --text-brand-active: #838194;
269
+
270
+ --icon-brand: #636174;
271
+ --icon-brand-hover: #737184;
272
+ --icon-brand-active: #838194;
273
+
274
+ --bg-progress-success: #32F08C;
275
+ --bg-progress-warning: #FFAD5B;
276
+ --bg-progress-error: #FF9CA8;
277
+ --bg-progress-info: #79B8FF;
278
+
279
+ --bg-slider-track: rgba(255, 255, 255, 0.06);
280
+ --bg-slider-fill: #32F08C;
281
+ --bg-slider-thumb: #32F08C;
282
+
283
+ --bg-calendar-hover: rgba(255, 255, 255, 0.04);
284
+ --bg-calendar-selected: #32F08C;
285
+ --text-calendar-selected: #0C0C0D;
286
+
287
+ --bg-fileupload-border: rgba(255, 255, 255, 0.12);
288
+ --bg-fileupload-hover: rgba(50, 240, 140, 0.12);
289
+ --bg-fileupload-dragging: rgba(50, 240, 140, 0.18);
290
+
291
+ --bg-timeline-line: rgba(255, 255, 255, 0.12);
292
+ --bg-timeline-marker: #32F08C;
293
+
294
+ --body-xs-font-size: 11px;
295
+ --body-xs-line-height: 16px;
296
+ --body-sm-font-size: 12px;
297
+ --body-sm-line-height: 18px;
298
+ --body-base-font-size: 13px;
299
+ --body-base-line-height: 20px;
300
+ --body-strong-xs-font-weight: 500;
301
+ --body-strong-sm-font-weight: 500;
302
+ --body-strong-base-font-weight: 500;
303
+
304
+ --heading-3xs-font-size: 11px;
305
+ --heading-3xs-line-height: 16px;
306
+ --heading-2xs-font-size: 12px;
307
+ --heading-2xs-line-height: 16px;
308
+ --heading-xs-font-size: 13px;
309
+ --heading-xs-line-height: 18px;
310
+ --heading-sm-font-size: 14px;
311
+ --heading-sm-line-height: 20px;
312
+ --heading-base-font-size: 16px;
313
+ --heading-base-line-height: 22px;
314
+ --heading-md-font-size: 18px;
315
+ --heading-md-line-height: 28px;
316
+ --heading-lg-font-size: 24px;
317
+ --heading-lg-line-height: 32px;
318
+ --heading-xl-font-size: 28px;
319
+ --heading-xl-line-height: 36px;
320
+ --heading-2xl-font-size: 32px;
321
+ --heading-2xl-line-height: 40px;
322
+ --heading-3xl-font-size: 36px;
323
+ --heading-3xl-line-height: 44px;
324
+ --heading-font-weight: 600;
325
+
326
+ --code-editor-font-family: 'JetBrains Mono', 'Fira Code', monospace;
327
+ --code-editor-font-size: 13px;
328
+ --code-editor-font-weight: 450;
329
+ --code-editor-line-height: 20px;
330
+ --code-editor-letter-spacing: -0.02em;
331
+ --code-terminal-font-family: 'JetBrains Mono', 'Fira Code', monospace;
332
+ --code-terminal-font-size: 13px;
333
+ --code-terminal-font-weight: 450;
334
+ --code-terminal-line-height: 20px;
335
+
336
+ --icon-filter: brightness(0) saturate(0) invert(0.9);
337
+
338
+ .ds-input--prefix {
339
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239599A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'></circle><line x1='21' y1='21' x2='16.65' y2='16.65'></line></svg>") !important;
340
+ }
215
341
  }