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: { value: "000000" },
266 weight: { value: "normal" },
267 },
268 comment: {
269 color: { value: "000000" },
270 weight: { value: "normal" },
271 },
272 punctuation: {
273 color: { value: "000000" },
274 weight: { value: "normal" },
275 },
276 constant: {
277 color: { value: "000000" },
278 weight: { value: "normal" },
279 },
280 keyword: {
281 color: { value: "000000" },
282 weight: { value: "normal" },
283 },
284 function: {
285 color: { value: "000000" },
286 weight: { value: "normal" },
287 },
288 type: {
289 color: { value: "000000" },
290 weight: { value: "normal" },
291 },
292 variant: {
293 color: { value: "000000" },
294 weight: { value: "normal" },
295 },
296 property: {
297 color: { value: "000000" },
298 weight: { value: "normal" },
299 },
300 enum: {
301 color: { value: "000000" },
302 weight: { value: "normal" },
303 },
304 operator: {
305 color: { value: "000000" },
306 weight: { value: "normal" },
307 },
308 string: {
309 color: { value: "000000" },
310 weight: { value: "normal" },
311 },
312 number: {
313 color: { value: "000000" },
314 weight: { value: "normal" },
315 },
316 boolean: {
317 color: { value: "000000" },
318 weight: { value: "normal" },
319 },
320 predictive: {
321 color: { value: "000000" },
322 weight: { value: "normal" },
323 },
324};
325
326const player = {
327 1: {
328 baseColor: {
329 value: core.color.neutral[999].value,
330 },
331 cursorColor: {
332 value: core.color.neutral[999].value,
333 },
334 selectionColor: {
335 value: core.color.neutral[999].value,
336 },
337 borderColor: {
338 value: core.color.neutral[999].value,
339 },
340 },
341 2: {
342 baseColor: {
343 value: core.color.neutral[999].value,
344 },
345 cursorColor: {
346 value: core.color.neutral[999].value,
347 },
348 selectionColor: {
349 value: core.color.neutral[999].value,
350 },
351 borderColor: {
352 value: core.color.neutral[999].value,
353 },
354 },
355 3: {
356 baseColor: {
357 value: core.color.neutral[999].value,
358 },
359 cursorColor: {
360 value: core.color.neutral[999].value,
361 },
362 selectionColor: {
363 value: core.color.neutral[999].value,
364 },
365 borderColor: {
366 value: core.color.neutral[999].value,
367 },
368 },
369 4: {
370 baseColor: {
371 value: core.color.neutral[999].value,
372 },
373 cursorColor: {
374 value: core.color.neutral[999].value,
375 },
376 selectionColor: {
377 value: core.color.neutral[999].value,
378 },
379 borderColor: {
380 value: core.color.neutral[999].value,
381 },
382 },
383 5: {
384 baseColor: {
385 value: core.color.neutral[999].value,
386 },
387 cursorColor: {
388 value: core.color.neutral[999].value,
389 },
390 selectionColor: {
391 value: core.color.neutral[999].value,
392 },
393 borderColor: {
394 value: core.color.neutral[999].value,
395 },
396 },
397 6: {
398 baseColor: {
399 value: core.color.neutral[999].value,
400 },
401 cursorColor: {
402 value: core.color.neutral[999].value,
403 },
404 selectionColor: {
405 value: core.color.neutral[999].value,
406 },
407 borderColor: {
408 value: core.color.neutral[999].value,
409 },
410 },
411 7: {
412 baseColor: {
413 value: core.color.neutral[999].value,
414 },
415 cursorColor: {
416 value: core.color.neutral[999].value,
417 },
418 selectionColor: {
419 value: core.color.neutral[999].value,
420 },
421 borderColor: {
422 value: core.color.neutral[999].value,
423 },
424 },
425 8: {
426 baseColor: {
427 value: core.color.neutral[999].value,
428 },
429 cursorColor: {
430 value: core.color.neutral[999].value,
431 },
432 selectionColor: {
433 value: core.color.neutral[999].value,
434 },
435 borderColor: {
436 value: core.color.neutral[999].value,
437 },
438 },
439};
440
441const shadowAlpha = {
442 value: 0.32,
443};
444
445export default function dark(): Theme {
446 return {
447 backgroundColor,
448 borderColor,
449 textColor,
450 iconColor,
451 editor,
452 syntax,
453 player,
454 shadowAlpha,
455 };
456}