projectPanel.ts

 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: background(layer, "active"),
23            text: text(layer, "mono", "active", { size: "sm" }),
24        },
25        activeHover: {
26            background: background(layer, "active"),
27            text: text(layer, "mono", "active", { size: "sm" }),
28        },
29    }
30
31    return {
32        openProjectButton: {
33            background: background(layer),
34            border: border(layer, "active"),
35            cornerRadius: 4,
36            margin: {
37                top: 16,
38                left: 16,
39                right: 16,
40            },
41            padding: {
42                top: 3,
43                bottom: 3,
44                left: 7,
45                right: 7,
46            },
47            ...text(layer, "sans", "default", { size: "sm" }),
48            hover: {
49                ...text(layer, "sans", "default", { size: "sm" }),
50                background: background(layer, "hovered"),
51                border: border(layer, "active"),
52            },
53        },
54        background: background(layer),
55        padding: { left: 12, right: 12, top: 6, bottom: 6 },
56        indentWidth: 8,
57        entry,
58        draggedEntry: {
59            ...baseEntry,
60            text: text(layer, "mono", "on", { size: "sm" }),
61            background: withOpacity(background(layer, "on"), 0.9),
62            border: border(layer),
63        },
64        ignoredEntry: {
65            ...entry,
66            text: text(layer, "mono", "disabled"),
67        },
68        cutEntry: {
69            ...entry,
70            text: text(layer, "mono", "disabled"),
71            active: {
72                background: background(layer, "active"),
73                text: text(layer, "mono", "disabled", { size: "sm" }),
74            },
75        },
76        filenameEditor: {
77            background: background(layer, "on"),
78            text: text(layer, "mono", "on", { size: "sm" }),
79            selection: colorScheme.players[0],
80        },
81    }
82}