1import { ColorScheme } from "../themes/common/colorScheme"
2import { withOpacity } from "../utils/color"
3import { background, border, foreground, text } from "./components"
4
5export default function projectPanel(colorScheme: ColorScheme) {
6 let layer = colorScheme.middle
7
8 let baseEntry = {
9 height: 24,
10 iconColor: foreground(layer, "variant"),
11 iconSize: 8,
12 iconSpacing: 8,
13 }
14
15 let entry = {
16 ...baseEntry,
17 text: text(layer, "mono", "variant", { size: "sm" }),
18 hover: {
19 background: background(layer, "variant", "hovered"),
20 },
21 active: {
22 background: colorScheme.isLight
23 ? withOpacity(background(layer, "active"), 0.5)
24 : background(layer, "active"),
25 text: text(layer, "mono", "active", { size: "sm" }),
26 },
27 activeHover: {
28 background: background(layer, "active"),
29 text: text(layer, "mono", "active", { size: "sm" }),
30 },
31 }
32
33 return {
34 openProjectButton: {
35 background: background(layer),
36 border: border(layer, "active"),
37 cornerRadius: 4,
38 margin: {
39 top: 16,
40 left: 16,
41 right: 16,
42 },
43 padding: {
44 top: 3,
45 bottom: 3,
46 left: 7,
47 right: 7,
48 },
49 ...text(layer, "sans", "default", { size: "sm" }),
50 hover: {
51 ...text(layer, "sans", "default", { size: "sm" }),
52 background: background(layer, "hovered"),
53 border: border(layer, "active"),
54 },
55 },
56 background: background(layer),
57 padding: { left: 12, right: 12, top: 6, bottom: 6 },
58 indentWidth: 8,
59 entry,
60 draggedEntry: {
61 ...baseEntry,
62 text: text(layer, "mono", "on", { size: "sm" }),
63 background: withOpacity(background(layer, "on"), 0.9),
64 border: border(layer),
65 },
66 ignoredEntry: {
67 ...entry,
68 text: text(layer, "mono", "disabled"),
69 },
70 cutEntry: {
71 ...entry,
72 text: text(layer, "mono", "disabled"),
73 active: {
74 background: background(layer, "active"),
75 text: text(layer, "mono", "disabled", { size: "sm" }),
76 },
77 },
78 filenameEditor: {
79 background: background(layer, "on"),
80 text: text(layer, "mono", "on", { size: "sm" }),
81 selection: colorScheme.players[0],
82 },
83 }
84}