1import { ColorScheme } from "../themes/common/colorScheme"
 2import { background, border, borderColor, text } from "./components"
 3
 4export default function contextMenu(colorScheme: ColorScheme) {
 5    let layer = colorScheme.middle
 6    return {
 7        background: background(layer),
 8        cornerRadius: 10,
 9        padding: 4,
10        shadow: colorScheme.popoverShadow,
11        border: border(layer),
12        keystrokeMargin: 30,
13        item: {
14            iconSpacing: 8,
15            iconWidth: 14,
16            padding: { left: 6, right: 6, top: 2, bottom: 2 },
17            cornerRadius: 6,
18            label: text(layer, "sans", { size: "sm" }),
19            keystroke: {
20                ...text(layer, "sans", "variant", {
21                    size: "sm",
22                    weight: "bold",
23                }),
24                padding: { left: 3, right: 3 },
25            },
26            hover: {
27                background: background(layer, "hovered"),
28                label: text(layer, "sans", "hovered", { size: "sm" }),
29            },
30            active: {
31                background: background(layer, "active"),
32                label: text(layer, "sans", "active", { size: "sm" }),
33            },
34            activeHover: {
35                background: background(layer, "active"),
36                label: text(layer, "sans", "active", { size: "sm" }),
37            },
38        },
39        separator: {
40            background: borderColor(layer),
41            margin: { top: 2, bottom: 2 },
42        },
43    }
44}