1import { selectorModal } from "./selector-modal";
2import Theme from "./theme";
3
4export default function app(theme: Theme): Object {
5 return {
6 selector: selectorModal(theme),
7 workspace: {
8 background: "$surface.500",
9 leaderBorderOpacity: 0.7,
10 leader_border_width: 2.0,
11 active_tab: {
12 background: "$surface.300",
13 extends: "$workspace.tab",
14 text: "$text.primary",
15 border: {
16 bottom: false,
17 },
18 },
19 left_sidebar: {
20 extends: "$workspace.sidebar",
21 border: {
22 color: "$border.primary",
23 right: true,
24 width: 1,
25 },
26 },
27 pane_divider: {
28 color: "$border.primary",
29 width: 1,
30 },
31 right_sidebar: {
32 extends: "$workspace.sidebar",
33 border: {
34 color: "$border.primary",
35 left: true,
36 width: 1,
37 },
38 },
39 sidebar: {
40 width: 30,
41 active_item: {
42 extends: "$workspace.sidebar.item",
43 icon_color: "$text.primary.color",
44 },
45 border: {
46 color: "$border.primary",
47 right: true,
48 width: 1,
49 },
50 item: {
51 height: "$workspace.tab.height",
52 icon_color: "$text.muted.color",
53 icon_size: 18,
54 },
55 resize_handle: {
56 background: "$border.primary",
57 padding: {
58 left: 1,
59 },
60 },
61 },
62 status_bar: {
63 cursor_position: "$text.muted",
64 diagnostic_message: "$text.muted",
65 height: 24,
66 item_spacing: 8,
67 lsp_message: "$text.muted",
68 padding: {
69 left: 6,
70 right: 6,
71 },
72 },
73 tab: {
74 height: 34,
75 icon_close: "$text.muted.color",
76 icon_close_active: "$text.primary.color",
77 icon_conflict: "$status.warn",
78 icon_dirty: "$status.info",
79 icon_width: 8,
80 spacing: 10,
81 text: "$text.muted",
82 border: {
83 bottom: true,
84 color: "$border.primary",
85 left: true,
86 overlay: true,
87 width: 1,
88 },
89 padding: {
90 left: 12,
91 right: 12,
92 },
93 },
94 titlebar: {
95 avatar_width: 18,
96 height: 32,
97 share_icon_active_color: "$text.primary.color",
98 share_icon_color: "$text.muted.color",
99 title: "$text.primary",
100 avatar: {
101 corner_radius: 10,
102 border: {
103 color: "#00000088",
104 width: 1,
105 },
106 },
107 avatar_ribbon: {
108 background: "#ff0000",
109 height: 3,
110 width: 12,
111 },
112 border: {
113 bottom: true,
114 color: "$border.primary",
115 width: 1,
116 },
117 hovered_sign_in_prompt: {
118 color: "$text.secondary.color",
119 extends: "$workspace.titlebar.sign_in_prompt",
120 },
121 offline_icon: {
122 color: "$text.muted.color",
123 width: 16,
124 padding: {
125 right: 4,
126 },
127 },
128 outdated_warning: {
129 extends: "$text.muted",
130 size: 13,
131 },
132 sign_in_prompt: {
133 extends: "$text.muted",
134 size: 13,
135 underline: true,
136 padding: {
137 right: 8,
138 },
139 },
140 },
141 toolbar: {
142 height: 44,
143 },
144 },
145 chat_panel: {
146 extends: "$panel",
147 channel_name: {
148 extends: "$text.primary",
149 weight: "bold",
150 },
151 channel_name_hash: {
152 text: "$text.muted",
153 padding: {
154 right: 8,
155 },
156 },
157 channel_select: {
158 active_item: {
159 extends: "$chat_panel.channel_select.item",
160 name: "$text.primary",
161 },
162 header: {
163 extends: "$chat_panel.channel_select.active_item",
164 padding: {
165 bottom: 4,
166 left: 0,
167 },
168 },
169 hovered_active_item: {
170 extends: "$chat_panel.channel_select.hovered_item",
171 name: "$text.primary",
172 },
173 hovered_item: {
174 background: "$state.hover",
175 corner_radius: 6,
176 extends: "$chat_panel.channel_select.item",
177 },
178 item: {
179 name: "$text.secondary",
180 padding: 4,
181 hash: {
182 extends: "$text.muted",
183 margin: {
184 right: 8,
185 },
186 },
187 },
188 menu: {
189 background: "$surface.500",
190 corner_radius: 6,
191 padding: 4,
192 border: {
193 color: "$border.primary",
194 width: 1,
195 },
196 shadow: {
197 blur: 16,
198 color: "$shadow.0",
199 offset: [0, 2],
200 },
201 },
202 },
203 hovered_sign_in_prompt: {
204 color: "$text.secondary.color",
205 extends: "$chat_panel.sign_in_prompt",
206 },
207 input_editor: {
208 background: "$surface.300",
209 corner_radius: 6,
210 placeholder_text: "$text.muted",
211 selection: "$selection.host",
212 text: "$text.primary",
213 border: {
214 color: "$border.primary",
215 width: 1,
216 },
217 padding: {
218 bottom: 7,
219 left: 8,
220 right: 8,
221 top: 7,
222 },
223 },
224 message: {
225 body: "$text.secondary",
226 timestamp: "$text.muted",
227 padding: {
228 bottom: 6,
229 },
230 sender: {
231 extends: "$text.primary",
232 weight: "bold",
233 margin: {
234 right: 8,
235 },
236 },
237 },
238 pending_message: {
239 extends: "$chat_panel.message",
240 body: {
241 color: "$text.muted.color",
242 },
243 sender: {
244 color: "$text.muted.color",
245 },
246 timestamp: {
247 color: "$text.muted.color",
248 },
249 },
250 sign_in_prompt: {
251 extends: "$text.primary",
252 underline: true,
253 },
254 },
255 contacts_panel: {
256 extends: "$panel",
257 host_row_height: 28,
258 tree_branch_color: "$surface.100",
259 tree_branch_width: 1,
260 host_avatar: {
261 corner_radius: 10,
262 width: 18,
263 },
264 host_username: {
265 extends: "$text.primary",
266 padding: {
267 left: 8,
268 },
269 },
270 hovered_shared_project: {
271 background: "$state.hover",
272 corner_radius: 6,
273 extends: "$contacts_panel.shared_project",
274 },
275 hovered_unshared_project: {
276 background: "$state.hover",
277 corner_radius: 6,
278 extends: "$contacts_panel.unshared_project",
279 },
280 project: {
281 guest_avatar_spacing: 4,
282 height: 24,
283 guest_avatar: {
284 corner_radius: 8,
285 width: 14,
286 },
287 name: {
288 extends: "$text.secondary",
289 margin: {
290 right: 6,
291 },
292 },
293 padding: {
294 left: 8,
295 },
296 },
297 shared_project: {
298 extends: "$contacts_panel.project",
299 name: {
300 color: "$text.primary.color",
301 },
302 },
303 unshared_project: {
304 extends: "$contacts_panel.project",
305 },
306 },
307 editor: {
308 active_line_background: "$state.active_line",
309 background: "$surface.300",
310 code_actions_indicator: "$text.muted.color",
311 diff_background_deleted: "$state.deleted_line",
312 diff_background_inserted: "$state.inserted_line",
313 document_highlight_read_background: "#99999920",
314 document_highlight_write_background: "#99999916",
315 error_color: "$status.bad",
316 guest_selections: "$selection.guests",
317 gutter_background: "$surface.300",
318 gutter_padding_factor: 2.5,
319 highlighted_line_background: "$state.highlighted_line",
320 line_number: "$text.muted.color",
321 line_number_active: "$text.primary.color",
322 rename_fade: 0.6,
323 selection: "$selection.host",
324 text_color: "$text.secondary.color",
325 unnecessary_code_fade: 0.5,
326 autocomplete: {
327 background: "$surface.100",
328 corner_radius: 6,
329 padding: 6,
330 border: {
331 color: "$border.secondary",
332 width: 2,
333 },
334 hovered_item: {
335 background: "$state.hover",
336 extends: "$editor.autocomplete.item",
337 },
338 item: {
339 corner_radius: 6,
340 padding: {
341 bottom: 2,
342 left: 6,
343 right: 6,
344 top: 2,
345 },
346 },
347 margin: {
348 left: -14,
349 },
350 match_highlight: {
351 color: "$editor.syntax.keyword.color",
352 weight: "$editor.syntax.keyword.weight",
353 },
354 selected_item: {
355 background: "$state.selected",
356 extends: "$editor.autocomplete.item",
357 },
358 },
359 diagnostic_header: {
360 background: "$editor.background",
361 icon_width_factor: 1.5,
362 text_scale_factor: 0.857,
363 border: {
364 bottom: true,
365 color: "$border.secondary",
366 top: true,
367 width: 1,
368 },
369 code: {
370 extends: "$text.muted",
371 size: 14,
372 margin: {
373 left: 10,
374 },
375 },
376 message: {
377 highlight_text: {
378 extends: "$text.primary",
379 size: 14,
380 weight: "bold",
381 },
382 text: {
383 extends: "$text.secondary",
384 size: 14,
385 },
386 },
387 },
388 diagnostic_path_header: {
389 background: "$state.active_line",
390 text_scale_factor: 0.857,
391 filename: {
392 extends: "$text.primary",
393 size: 14,
394 },
395 path: {
396 extends: "$text.muted",
397 size: 14,
398 margin: {
399 left: 12,
400 },
401 },
402 },
403 error_diagnostic: {
404 text_scale_factor: 0.857,
405 header: {
406 border: {
407 color: "$border.primary",
408 top: true,
409 width: 1,
410 },
411 },
412 message: {
413 highlight_text: {
414 color: "$status.bad",
415 extends: "$text.secondary",
416 size: 14,
417 weight: "bold",
418 },
419 text: {
420 color: "$status.bad",
421 extends: "$text.secondary",
422 size: 14,
423 },
424 },
425 },
426 hint_diagnostic: {
427 extends: "$editor.error_diagnostic",
428 message: {
429 highlight_text: {
430 color: "$status.info",
431 },
432 text: {
433 color: "$status.info",
434 },
435 },
436 },
437 information_diagnostic: {
438 extends: "$editor.error_diagnostic",
439 message: {
440 highlight_text: {
441 color: "$status.info",
442 },
443 text: {
444 color: "$status.info",
445 },
446 },
447 },
448 invalid_error_diagnostic: {
449 extends: "$editor.error_diagnostic",
450 message: {
451 highlight_text: {
452 color: "$text.muted.color",
453 },
454 text: {
455 color: "$text.muted.color",
456 },
457 },
458 },
459 invalid_hint_diagnostic: {
460 extends: "$editor.hint_diagnostic",
461 message: {
462 highlight_text: {
463 color: "$text.muted.color",
464 },
465 text: {
466 color: "$text.muted.color",
467 },
468 },
469 },
470 invalid_information_diagnostic: {
471 extends: "$editor.information_diagnostic",
472 message: {
473 highlight_text: {
474 color: "$text.muted.color",
475 },
476 text: {
477 color: "$text.muted.color",
478 },
479 },
480 },
481 invalid_warning_diagnostic: {
482 extends: "$editor.warning_diagnostic",
483 message: {
484 highlight_text: {
485 color: "$text.muted.color",
486 },
487 text: {
488 color: "$text.muted.color",
489 },
490 },
491 },
492 warning_diagnostic: {
493 extends: "$editor.error_diagnostic",
494 message: {
495 highlight_text: {
496 color: "$status.warn",
497 },
498 text: {
499 color: "$status.warn",
500 },
501 },
502 },
503 },
504 project_diagnostics: {
505 background: "$surface.300",
506 tab_icon_spacing: 4,
507 tab_icon_width: 13,
508 tab_summary_spacing: 10,
509 empty_message: {
510 extends: "$text.primary",
511 size: 18,
512 },
513 status_bar_item: {
514 extends: "$text.muted",
515 margin: {
516 right: 10,
517 },
518 },
519 },
520 project_panel: {
521 extends: "$panel",
522 entry: {
523 height: 22,
524 icon_color: "$text.muted.color",
525 icon_size: 8,
526 icon_spacing: 8,
527 text: "$text.secondary",
528 },
529 hovered_entry: {
530 background: "$state.hover",
531 extends: "$project_panel.entry",
532 },
533 hovered_selected_entry: {
534 extends: "$project_panel.hovered_entry",
535 text: {
536 extends: "$text.primary",
537 },
538 },
539 padding: {
540 top: 6,
541 },
542 selected_entry: {
543 extends: "$project_panel.entry",
544 text: {
545 extends: "$text.primary",
546 },
547 },
548 },
549 search: {
550 background: "$surface.300",
551 match_background: "$state.highlighted_line",
552 tab_icon_spacing: 4,
553 tab_icon_width: 14,
554 active_hovered_option_button: {
555 background: "$surface.100",
556 extends: "$search.option_button",
557 },
558 active_option_button: {
559 background: "$surface.100",
560 extends: "$search.option_button",
561 },
562 editor: {
563 background: "$surface.500",
564 corner_radius: 6,
565 max_width: 400,
566 placeholder_text: "$text.muted",
567 selection: "$selection.host",
568 text: "$text.primary",
569 border: {
570 color: "$border.primary",
571 width: 1,
572 },
573 margin: {
574 bottom: 5,
575 left: 5,
576 right: 5,
577 top: 5,
578 },
579 padding: {
580 bottom: 3,
581 left: 13,
582 right: 13,
583 top: 3,
584 },
585 },
586 hovered_option_button: {
587 background: "$surface.100",
588 extends: "$search.option_button",
589 },
590 invalid_editor: {
591 extends: "$search.editor",
592 border: {
593 color: "$status.bad",
594 width: 1,
595 },
596 },
597 match_index: {
598 extends: "$text.secondary",
599 padding: 6,
600 },
601 option_button: {
602 background: "$surface.300",
603 corner_radius: 6,
604 extends: "$text.secondary",
605 border: {
606 color: "$border.primary",
607 width: 1,
608 },
609 margin: {
610 left: 1,
611 right: 1,
612 },
613 padding: {
614 bottom: 1,
615 left: 6,
616 right: 6,
617 top: 1,
618 },
619 },
620 option_button_group: {
621 padding: {
622 left: 2,
623 right: 2,
624 },
625 },
626 results_status: {
627 extends: "$text.primary",
628 size: 18,
629 },
630 },
631 };
632}