projectPanel.ts

 1import Theme from "../themes/common/theme";
 2import { panel } from "./app";
 3import { backgroundColor, iconColor, player, shadow, text } from "./components";
 4
 5export default function projectPanel(theme: Theme) {
 6  return {
 7    ...panel,
 8    padding: { left: 12, right: 12, top: 6, bottom: 6 },
 9    indentWidth: 20,
10    entry: {
11      height: 24,
12      iconColor: iconColor(theme, "muted"),
13      iconSize: 8,
14      iconSpacing: 8,
15      text: text(theme, "mono", "muted", { size: "sm" }),
16      hover: {
17        background: backgroundColor(theme, 300, "hovered"),
18        text: text(theme, "mono", "primary", { size: "sm" }),
19      },
20      active: {
21        background: backgroundColor(theme, 300, "active"),
22        text: text(theme, "mono", "primary", { size: "sm" }),
23      },
24      activeHover: {
25        background: backgroundColor(theme, 300, "hovered"),
26        text: text(theme, "mono", "active", { size: "sm" }),
27      }
28    },
29    ignoredEntryFade: 0.6,
30    filenameEditor: {
31      background: backgroundColor(theme, 500, "active"),
32      text: text(theme, "mono", "primary", { size: "sm" }),
33      selection: player(theme, 1).selection,
34    },
35    contextMenu: {
36      width: 100,
37      // background: "#ff0000",
38      background: backgroundColor(theme, 300, "base"),
39      cornerRadius: 6,
40      padding: {
41        bottom: 2,
42        left: 6,
43        right: 6,
44        top: 2,
45      },
46      item: {
47        label: text(theme, "sans", "secondary", { size: "sm" }),
48      },
49      shadow: shadow(theme),
50    }
51  };
52}