Update style.css
Browse files
style.css
CHANGED
@@ -5,30 +5,323 @@ div.svelte-15lo0d8 {
|
|
5 |
align-content: center;
|
6 |
}
|
7 |
|
8 |
-
|
9 |
-
|
10 |
-
|
11 |
-
|
12 |
-
|
13 |
-
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
border-
|
18 |
-
|
19 |
-
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
-
|
24 |
-
|
25 |
-
|
26 |
-
|
27 |
-
|
28 |
-
|
29 |
-
|
30 |
-
|
31 |
-
|
32 |
-
|
33 |
-
|
34 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
5 |
align-content: center;
|
6 |
}
|
7 |
|
8 |
+
--body-background-fill: var(
|
9 |
+
--background-fill-primary);
|
10 |
+
--body-text-color: var(
|
11 |
+
--neutral-100);
|
12 |
+
--color-accent-soft: var(
|
13 |
+
--neutral-700);
|
14 |
+
--background-fill-primary: #16181e;
|
15 |
+
--background-fill-secondary: var(
|
16 |
+
--neutral-900);
|
17 |
+
--border-color-accent: var(
|
18 |
+
--neutral-600);
|
19 |
+
--border-color-primary: var(
|
20 |
+
--neutral-700);
|
21 |
+
--link-text-color-active: var(
|
22 |
+
--secondary-500);
|
23 |
+
--link-text-color: var(
|
24 |
+
--secondary-500);
|
25 |
+
--link-text-color-hover: var(
|
26 |
+
--secondary-400);
|
27 |
+
--link-text-color-visited: var(
|
28 |
+
--secondary-600);
|
29 |
+
--body-text-color-subdued: var(
|
30 |
+
--neutral-400);
|
31 |
+
--shadow-spread: 1px;
|
32 |
+
--block-background-fill: var(
|
33 |
+
--neutral-800);
|
34 |
+
--block-border-color: var(
|
35 |
+
--border-color-primary);
|
36 |
+
--block_border_width: None;
|
37 |
+
--block-info-text-color: var(
|
38 |
+
--body-text-color-subdued);
|
39 |
+
--block-label-background-fill: var(
|
40 |
+
--background-fill-secondary);
|
41 |
+
--block-label-border-color: var(
|
42 |
+
--border-color-primary);
|
43 |
+
--block_label_border_width: None;
|
44 |
+
--block-label-text-color: var(
|
45 |
+
--neutral-200);
|
46 |
+
--block_shadow: None;
|
47 |
+
--block_title_background_fill: None;
|
48 |
+
--block_title_border_color: None;
|
49 |
+
--block_title_border_width: None;
|
50 |
+
--block-title-text-color: var(
|
51 |
+
--neutral-200);
|
52 |
+
--panel-background-fill: var(
|
53 |
+
--background-fill-secondary);
|
54 |
+
--panel-border-color: var(
|
55 |
+
--border-color-primary);
|
56 |
+
--panel_border_width: None;
|
57 |
+
--border-color-accent-subdued: var(
|
58 |
+
--border-color-accent);
|
59 |
+
--chatbot-code-background-color: var(
|
60 |
+
--neutral-800);
|
61 |
+
--checkbox-background-color: var(
|
62 |
+
--neutral-800);
|
63 |
+
--checkbox-background-color-focus: var(
|
64 |
+
--checkbox-background-color);
|
65 |
+
--checkbox-background-color-hover: var(
|
66 |
+
--checkbox-background-color);
|
67 |
+
--checkbox-background-color-selected: var(
|
68 |
+
--secondary-600);
|
69 |
+
--checkbox-border-color: var(
|
70 |
+
--neutral-700);
|
71 |
+
--checkbox-border-color-focus: var(
|
72 |
+
--secondary-500);
|
73 |
+
--checkbox-border-color-hover: var(
|
74 |
+
--neutral-600);
|
75 |
+
--checkbox-border-color-selected: var(
|
76 |
+
--secondary-600);
|
77 |
+
--checkbox-border-width: var(
|
78 |
+
--input-border-width);
|
79 |
+
--checkbox-label-background-fill: linear-gradient(to top, var(
|
80 |
+
--neutral-900), var(--neutral-800));
|
81 |
+
--checkbox-label-background-fill-hover: linear-gradient(to top, var(
|
82 |
+
--neutral-900), var(--neutral-800));
|
83 |
+
--checkbox-label-background-fill-selected: var(
|
84 |
+
--checkbox-label-background-fill);
|
85 |
+
--checkbox-label-border-color: var(
|
86 |
+
--border-color-primary);
|
87 |
+
--checkbox-label-border-color-hover: var(
|
88 |
+
--checkbox-label-border-color);
|
89 |
+
--checkbox-label-border-width: var(
|
90 |
+
--input-border-width);
|
91 |
+
--checkbox-label-text-color: var(
|
92 |
+
--body-text-color);
|
93 |
+
--checkbox-label-text-color-selected: var(
|
94 |
+
--checkbox-label-text-color);
|
95 |
+
--error-background-fill: var(
|
96 |
+
--neutral-900);
|
97 |
+
--error-border-color: #ef4444;
|
98 |
+
--error_border_width: None;
|
99 |
+
--error-text-color: #fef2f2;
|
100 |
+
--error-icon-color: #ef4444;
|
101 |
+
--input-background-fill: var(
|
102 |
+
--neutral-800);
|
103 |
+
--input-background-fill-focus: var(
|
104 |
+
--secondary-600);
|
105 |
+
--input-background-fill-hover: var(
|
106 |
+
--input-background-fill);
|
107 |
+
--input-border-color: var(
|
108 |
+
--border-color-primary);
|
109 |
+
--input-border-color-focus: var(
|
110 |
+
--neutral-700);
|
111 |
+
--input-border-color-hover: var(
|
112 |
+
--input-border-color);
|
113 |
+
--input_border_width: None;
|
114 |
+
--input-placeholder-color: var(
|
115 |
+
--neutral-500);
|
116 |
+
--input_shadow: None;
|
117 |
+
--input-shadow-focus: 0 0 0 var(
|
118 |
+
--shadow-spread) var(--neutral-700), var(--shadow-inset);
|
119 |
+
--loader_color: None;
|
120 |
+
--slider_color: None;
|
121 |
+
--stat-background-fill: linear-gradient(to right, var(
|
122 |
+
--primary-400), var(--primary-600));
|
123 |
+
--table-border-color: var(
|
124 |
+
--neutral-700);
|
125 |
+
--table-even-background-fill: var(
|
126 |
+
--neutral-950);
|
127 |
+
--table-odd-background-fill: var(
|
128 |
+
--neutral-900);
|
129 |
+
--table-row-focus: var(
|
130 |
+
--color-accent-soft);
|
131 |
+
--button-border-width: var(
|
132 |
+
--input-border-width);
|
133 |
+
--button-cancel-background-fill: linear-gradient(to bottom right, #dc2626, #b91c1c);
|
134 |
+
--button-cancel-background-fill-hover: linear-gradient(to bottom right, #dc2626, #dc2626);
|
135 |
+
--button-cancel-border-color: #dc2626;
|
136 |
+
--button-cancel-border-color-hover: var(
|
137 |
+
--button-cancel-border-color);
|
138 |
+
--button-cancel-text-color: white;
|
139 |
+
--button-cancel-text-color-hover: var(
|
140 |
+
--button-cancel-text-color);
|
141 |
+
--button-primary-background-fill: linear-gradient(to bottom right, var(
|
142 |
+
--primary-500), var(--primary-600));
|
143 |
+
--button-primary-background-fill-hover: linear-gradient(to bottom right, var(
|
144 |
+
--primary-500), var(--primary-500));
|
145 |
+
--button-primary-border-color: var(
|
146 |
+
--primary-500);
|
147 |
+
--button-primary-border-color-hover: var(
|
148 |
+
--button-primary-border-color);
|
149 |
+
--button-primary-text-color: white;
|
150 |
+
--button-primary-text-color-hover: var(
|
151 |
+
--button-primary-text-color);
|
152 |
+
--button-secondary-background-fill: linear-gradient(to bottom right, var(
|
153 |
+
--neutral-600), var(--neutral-700));
|
154 |
+
--button-secondary-background-fill-hover: linear-gradient(to bottom right, var(
|
155 |
+
--neutral-600), var(--neutral-600));
|
156 |
+
--button-secondary-border-color: var(
|
157 |
+
--neutral-600);
|
158 |
+
--button-secondary-border-color-hover: var(
|
159 |
+
--button-secondary-border-color);
|
160 |
+
--button-secondary-text-color: white;
|
161 |
+
--button-secondary-text-color-hover: var(
|
162 |
+
--button-secondary-text-color);
|
163 |
+
--name: default;
|
164 |
+
--primary-50: #fff7ed;
|
165 |
+
--primary-100: #ffedd5;
|
166 |
+
--primary-200: #fed7aa;
|
167 |
+
--primary-300: #fdba74;
|
168 |
+
--primary-400: #fb923c;
|
169 |
+
--primary-500: #f97316;
|
170 |
+
--primary-600: #ea580c;
|
171 |
+
--primary-700: #c2410c;
|
172 |
+
--primary-800: #9a3412;
|
173 |
+
--primary-900: #7c2d12;
|
174 |
+
--primary-950: #6c2e12;
|
175 |
+
--secondary-50: #eff6ff;
|
176 |
+
--secondary-100: #dbeafe;
|
177 |
+
--secondary-200: #bfdbfe;
|
178 |
+
--secondary-300: #93c5fd;
|
179 |
+
--secondary-400: #60a5fa;
|
180 |
+
--secondary-500: #3b82f6;
|
181 |
+
--secondary-600: #2563eb;
|
182 |
+
--secondary-700: #1d4ed8;
|
183 |
+
--secondary-800: #1e40af;
|
184 |
+
--secondary-900: #1e3a8a;
|
185 |
+
--secondary-950: #1d3660;
|
186 |
+
--neutral-50: #f9fafb;
|
187 |
+
--neutral-100: #f3f4f6;
|
188 |
+
--neutral-200: #e5e7eb;
|
189 |
+
--neutral-300: #d1d5db;
|
190 |
+
--neutral-400: #9ca3af;
|
191 |
+
--neutral-500: #6b7280;
|
192 |
+
--neutral-600: #4b5563;
|
193 |
+
--neutral-700: #374151;
|
194 |
+
--neutral-800: #1f2937;
|
195 |
+
--neutral-900: #111827;
|
196 |
+
--neutral-950: #0b0f19;
|
197 |
+
--spacing-xxs: 1px;
|
198 |
+
--spacing-xs: 2px;
|
199 |
+
--spacing-sm: 4px;
|
200 |
+
--spacing-md: 6px;
|
201 |
+
--spacing-lg: 8px;
|
202 |
+
--spacing-xl: 10px;
|
203 |
+
--spacing-xxl: 16px;
|
204 |
+
--radius-xxs: 1px;
|
205 |
+
--radius-xs: 2px;
|
206 |
+
--radius-sm: 4px;
|
207 |
+
--radius-md: 6px;
|
208 |
+
--radius-lg: 8px;
|
209 |
+
--radius-xl: 12px;
|
210 |
+
--radius-xxl: 22px;
|
211 |
+
--text-xxs: 9px;
|
212 |
+
--text-xs: 10px;
|
213 |
+
--text-sm: 12px;
|
214 |
+
--text-md: 14px;
|
215 |
+
--text-lg: 16px;
|
216 |
+
--text-xl: 22px;
|
217 |
+
--text-xxl: 26px;
|
218 |
+
--font: 'Source Sans Pro', 'ui-sans-serif', 'system-ui', sans-serif;
|
219 |
+
--font-mono: 'IBM Plex Mono', 'ui-monospace', 'Consolas', monospace;
|
220 |
+
--body-text-size: var(
|
221 |
+
--text-md);
|
222 |
+
--body-text-weight: 400;
|
223 |
+
--embed-radius: var(
|
224 |
+
--radius-lg);
|
225 |
+
--color-accent: var(
|
226 |
+
--primary-500);
|
227 |
+
--shadow-drop: rgba(0,0,0,0.05) 0px 1px 2px 0px;
|
228 |
+
--shadow-drop-lg: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
229 |
+
--shadow-inset: rgba(0,0,0,0.05) 0px 2px 4px 0px inset;
|
230 |
+
--block-border-width: 1px;
|
231 |
+
--block-info-text-size: var(
|
232 |
+
--text-sm);
|
233 |
+
--block-info-text-weight: 400;
|
234 |
+
--block-label-border-width: 1px;
|
235 |
+
--block-label-shadow: var(
|
236 |
+
--block-shadow);
|
237 |
+
--block-label-margin: 0;
|
238 |
+
--block-label-padding: var(
|
239 |
+
--spacing-sm) var(--spacing-lg);
|
240 |
+
--block-label-radius: calc(var(
|
241 |
+
--radius-lg) - 1px) 0 calc(var(--radius-lg) - 1px) 0;
|
242 |
+
--block-label-right-radius: 0 calc(var(
|
243 |
+
--radius-lg) - 1px) 0 calc(var(--radius-lg) - 1px);
|
244 |
+
--block-label-text-size: var(
|
245 |
+
--text-sm);
|
246 |
+
--block-label-text-weight: 400;
|
247 |
+
--block-padding: var(
|
248 |
+
--spacing-xl) calc(var(--spacing-xl) + 2px);
|
249 |
+
--block-radius: var(
|
250 |
+
--radius-lg);
|
251 |
+
--block-shadow: var(
|
252 |
+
--shadow-drop);
|
253 |
+
--block-title-background-fill: none;
|
254 |
+
--block-title-border-color: none;
|
255 |
+
--block-title-border-width: 0px;
|
256 |
+
--block-title-padding: 0;
|
257 |
+
--block-title-radius: none;
|
258 |
+
--block-title-text-size: var(
|
259 |
+
--text-md);
|
260 |
+
--block-title-text-weight: 400;
|
261 |
+
--container-radius: var(
|
262 |
+
--radius-lg);
|
263 |
+
--form-gap-width: 1px;
|
264 |
+
--layout-gap: var(
|
265 |
+
--spacing-xxl);
|
266 |
+
--panel-border-width: 0;
|
267 |
+
--section-header-text-size: var(
|
268 |
+
--text-md);
|
269 |
+
--section-header-text-weight: 400;
|
270 |
+
--checkbox-border-radius: var(
|
271 |
+
--radius-sm);
|
272 |
+
--checkbox-label-gap: var(
|
273 |
+
--spacing-lg);
|
274 |
+
--checkbox-label-padding: var(
|
275 |
+
--spacing-md) calc(2 * var(--spacing-md));
|
276 |
+
--checkbox-label-shadow: var(
|
277 |
+
--shadow-drop);
|
278 |
+
--checkbox-label-text-size: var(
|
279 |
+
--text-md);
|
280 |
+
--checkbox-label-text-weight: 400;
|
281 |
+
--checkbox-check: url(
|
282 |
+
"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
|
283 |
+
--radio-circle: url(
|
284 |
+
"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
|
285 |
+
--checkbox-shadow: var(
|
286 |
+
--input-shadow);
|
287 |
+
--error-border-width: 1px;
|
288 |
+
--input-border-width: 1px;
|
289 |
+
--input-padding: var(
|
290 |
+
--spacing-xl);
|
291 |
+
--input-radius: var(
|
292 |
+
--radius-lg);
|
293 |
+
--input-shadow: 0 0 0 var(
|
294 |
+
--shadow-spread) transparent, var(--shadow-inset);
|
295 |
+
--input-text-size: var(
|
296 |
+
--text-md);
|
297 |
+
--input-text-weight: 400;
|
298 |
+
--loader-color: var(
|
299 |
+
--color-accent);
|
300 |
+
--prose-text-size: var(
|
301 |
+
--text-md);
|
302 |
+
--prose-text-weight: 400;
|
303 |
+
--prose-header-text-weight: 600;
|
304 |
+
--slider-color: auto;
|
305 |
+
--table-radius: var(
|
306 |
+
--radius-lg);
|
307 |
+
--button-large-padding: var(
|
308 |
+
--spacing-lg) calc(2 * var(--spacing-lg));
|
309 |
+
--button-large-radius: var(
|
310 |
+
--radius-lg);
|
311 |
+
--button-large-text-size: var(
|
312 |
+
--text-lg);
|
313 |
+
--button-large-text-weight: 600;
|
314 |
+
--button-shadow: var(
|
315 |
+
--shadow-drop);
|
316 |
+
--button-shadow-active: var(
|
317 |
+
--shadow-inset);
|
318 |
+
--button-shadow-hover: var(
|
319 |
+
--shadow-drop-lg);
|
320 |
+
--button-small-padding: var(
|
321 |
+
--spacing-sm) calc(2 * var(--spacing-sm));
|
322 |
+
--button-small-radius: var(
|
323 |
+
--radius-lg);
|
324 |
+
--button-small-text-size: var(
|
325 |
+
--text-md);
|
326 |
+
--button-small-text-weight: 400;
|
327 |
+
--button-transition: none;
|