1import core from "./core";
2import Theme from "./theme";
3
4const backgroundColor = {
5 100: {
6 base: {
7 value: core.color.neutral[999].value,
8 },
9 hovered: {
10 value: core.color.neutral[999].value,
11 },
12 active: {
13 value: core.color.neutral[999].value,
14 },
15 focused: {
16 value: core.color.neutral[999].value,
17 },
18 },
19 300: {
20 base: {
21 value: core.color.neutral[999].value,
22 },
23 hovered: {
24 value: core.color.neutral[999].value,
25 },
26 active: {
27 value: core.color.neutral[999].value,
28 },
29 focused: {
30 value: core.color.neutral[999].value,
31 },
32 },
33 500: {
34 base: {
35 value: core.color.neutral[999].value,
36 },
37 hovered: {
38 value: "#000000",
39 },
40 active: {
41 value: "#000000",
42 },
43 focused: {
44 value: "#000000",
45 },
46 },
47 ok: {
48 base: {
49 value: "#000000",
50 },
51 hovered: {
52 value: "#000000",
53 },
54 active: {
55 value: "#000000",
56 },
57 focused: {
58 value: "#000000",
59 },
60 },
61 error: {
62 base: {
63 value: "#000000",
64 },
65 hovered: {
66 value: "#000000",
67 },
68 active: {
69 value: "#000000",
70 },
71 focused: {
72 value: "#000000",
73 },
74 },
75 warning: {
76 base: {
77 value: "#000000",
78 },
79 hovered: {
80 value: "#000000",
81 },
82 active: {
83 value: "#000000",
84 },
85 focused: {
86 value: "#000000",
87 },
88 },
89 info: {
90 base: {
91 value: "#000000",
92 },
93 hovered: {
94 value: "#000000",
95 },
96 active: {
97 value: "#000000",
98 },
99 focused: {
100 value: "#000000",
101 },
102 },
103};
104
105const borderColor = {
106 primary: {
107 value: "#000000",
108 },
109 secondary: {
110 value: "#000000",
111 },
112 muted: {
113 value: "#000000",
114 },
115 focused: {
116 value: "#000000",
117 },
118 active: {
119 value: "#000000",
120 },
121 ok: {
122 value: "#000000",
123 },
124 error: {
125 value: "#000000",
126 },
127 warning: {
128 value: "#000000",
129 },
130 info: {
131 value: "#000000",
132 },
133};
134
135const textColor = {
136 primary: {
137 value: core.color.neutral[150].value,
138 },
139 secondary: {
140 value: core.color.neutral[350].value,
141 },
142 muted: {
143 value: core.color.neutral[550].value,
144 },
145 placeholder: {
146 value: core.color.neutral[750].value,
147 },
148 active: {
149 value: core.color.neutral[0].value,
150 },
151 feature: {
152 //TODO: (design) define feature and it's correct value
153 value: core.color.sky[500].value,
154 },
155 ok: {
156 value: core.color.green[600].value,
157 },
158 error: {
159 value: core.color.red[400].value,
160 },
161 warning: {
162 value: core.color.amber[300].value,
163 },
164 info: {
165 value: core.color.blue[500].value,
166 },
167};
168
169const iconColor = {
170 primary: {
171 value: core.color.neutral[300].value,
172 },
173 secondary: {
174 value: core.color.neutral[500].value,
175 },
176 muted: {
177 value: core.color.neutral[600].value,
178 },
179 placeholder: {
180 value: core.color.neutral[700].value,
181 },
182 active: {
183 value: core.color.neutral[50].value,
184 },
185 feature: {
186 //TODO: (design) define feature and it's correct value
187 value: core.color.sky[500].value,
188 },
189 ok: {
190 value: core.color.green[600].value,
191 },
192 error: {
193 value: core.color.red[400].value,
194 },
195 warning: {
196 value: core.color.amber[300].value,
197 },
198 info: {
199 value: core.color.blue[500].value,
200 },
201};
202
203const editor = {
204 background: {
205 value: backgroundColor[500].base.value,
206 },
207 indent_guide: {
208 value: core.color.neutral[999].value,
209 },
210 indent_guide_active: {
211 value: core.color.neutral[999].value,
212 },
213 line: {
214 active: {
215 value: core.color.neutral[999].value,
216 },
217 highlighted: {
218 value: core.color.neutral[999].value,
219 },
220 inserted: {
221 value: core.color.neutral[999].value,
222 },
223 deleted: {
224 value: core.color.neutral[999].value,
225 },
226 modified: {
227 value: core.color.neutral[999].value,
228 },
229 },
230 highlight: {
231 selection: {
232 value: core.color.neutral[999].value,
233 },
234 occurrence: {
235 value: core.color.neutral[999].value,
236 },
237 activeOccurrence: {
238 value: core.color.neutral[999].value,
239 },
240 matchingBracket: {
241 value: core.color.neutral[999].value,
242 },
243 match: {
244 value: core.color.neutral[999].value,
245 },
246 activeMatch: {
247 value: core.color.neutral[999].value,
248 },
249 related: {
250 value: core.color.neutral[999].value,
251 },
252 },
253 gutter: {
254 primary: {
255 value: core.color.neutral[999].value,
256 },
257 active: {
258 value: core.color.neutral[999].value,
259 },
260 },
261};
262
263const syntax = {
264 primary: {
265 color: {
266 value: core.color.neutral[150]
267 },
268 weight: { value: "normal" },
269 },
270 comment: {
271 color: { value: "000000" },
272 weight: { value: "normal" },
273 },
274 punctuation: {
275 color: { value: "000000" },
276 weight: { value: "normal" },
277 },
278 constant: {
279 color: { value: "000000" },
280 weight: { value: "normal" },
281 },
282 keyword: {
283 color: { value: "000000" },
284 weight: { value: "normal" },
285 },
286 function: {
287 color: { value: "000000" },
288 weight: { value: "normal" },
289 },
290 type: {
291 color: { value: "000000" },
292 weight: { value: "normal" },
293 },
294 variant: {
295 color: { value: "000000" },
296 weight: { value: "normal" },
297 },
298 property: {
299 color: { value: "000000" },
300 weight: { value: "normal" },
301 },
302 enum: {
303 color: { value: "000000" },
304 weight: { value: "normal" },
305 },
306 operator: {
307 color: { value: "000000" },
308 weight: { value: "normal" },
309 },
310 string: {
311 color: { value: "000000" },
312 weight: { value: "normal" },
313 },
314 number: {
315 color: { value: "000000" },
316 weight: { value: "normal" },
317 },
318 boolean: {
319 color: { value: "000000" },
320 weight: { value: "normal" },
321 },
322 predictive: {
323 color: { value: "000000" },
324 weight: { value: "normal" },
325 },
326};
327
328const player = {
329 1: {
330 baseColor: {
331 value: core.color.neutral[999].value,
332 },
333 cursorColor: {
334 value: core.color.neutral[999].value,
335 },
336 selectionColor: {
337 value: core.color.neutral[999].value,
338 },
339 borderColor: {
340 value: core.color.neutral[999].value,
341 },
342 },
343 2: {
344 baseColor: {
345 value: core.color.neutral[999].value,
346 },
347 cursorColor: {
348 value: core.color.neutral[999].value,
349 },
350 selectionColor: {
351 value: core.color.neutral[999].value,
352 },
353 borderColor: {
354 value: core.color.neutral[999].value,
355 },
356 },
357 3: {
358 baseColor: {
359 value: core.color.neutral[999].value,
360 },
361 cursorColor: {
362 value: core.color.neutral[999].value,
363 },
364 selectionColor: {
365 value: core.color.neutral[999].value,
366 },
367 borderColor: {
368 value: core.color.neutral[999].value,
369 },
370 },
371 4: {
372 baseColor: {
373 value: core.color.neutral[999].value,
374 },
375 cursorColor: {
376 value: core.color.neutral[999].value,
377 },
378 selectionColor: {
379 value: core.color.neutral[999].value,
380 },
381 borderColor: {
382 value: core.color.neutral[999].value,
383 },
384 },
385 5: {
386 baseColor: {
387 value: core.color.neutral[999].value,
388 },
389 cursorColor: {
390 value: core.color.neutral[999].value,
391 },
392 selectionColor: {
393 value: core.color.neutral[999].value,
394 },
395 borderColor: {
396 value: core.color.neutral[999].value,
397 },
398 },
399 6: {
400 baseColor: {
401 value: core.color.neutral[999].value,
402 },
403 cursorColor: {
404 value: core.color.neutral[999].value,
405 },
406 selectionColor: {
407 value: core.color.neutral[999].value,
408 },
409 borderColor: {
410 value: core.color.neutral[999].value,
411 },
412 },
413 7: {
414 baseColor: {
415 value: core.color.neutral[999].value,
416 },
417 cursorColor: {
418 value: core.color.neutral[999].value,
419 },
420 selectionColor: {
421 value: core.color.neutral[999].value,
422 },
423 borderColor: {
424 value: core.color.neutral[999].value,
425 },
426 },
427 8: {
428 baseColor: {
429 value: core.color.neutral[999].value,
430 },
431 cursorColor: {
432 value: core.color.neutral[999].value,
433 },
434 selectionColor: {
435 value: core.color.neutral[999].value,
436 },
437 borderColor: {
438 value: core.color.neutral[999].value,
439 },
440 },
441};
442
443const shadowAlpha = {
444 value: 0.32,
445};
446
447export default function dark(): Theme {
448 return {
449 backgroundColor,
450 borderColor,
451 textColor,
452 iconColor,
453 editor,
454 syntax,
455 player,
456 shadowAlpha,
457 };
458}