oak-team/oak-gpui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Set up vitest and add tests for interactive

Browse Source
This commit is contained in:
Nate Butler
2023-06-20 16:05:23 -07:00
committed by Mikayla Maki
parent 4bd89c4c8c
commit 5369f2c25a
25 changed files with 4545 additions and 2162 deletions
Download Patch File Download Diff File Expand all files Collapse all files
styles/src/styleTree/contextMenu.ts
+49 -49
View File
@@ -1,56 +1,56 @@
import { ColorScheme } from "../theme/colorScheme"
import { background, border, borderColor, text } from "./components"
import { interactive } from "./interactive"
import { interactive } from "../element/interactive"
import { toggleable } from "./toggle"
export default function contextMenu(colorScheme: ColorScheme) {
let layer = colorScheme.middle
return {
background: background(layer),
cornerRadius: 10,
padding: 4,
shadow: colorScheme.popoverShadow,
border: border(layer),
keystrokeMargin: 30,
item: toggleable(interactive({
base: {
iconSpacing: 8,
iconWidth: 14,
padding: { left: 6, right: 6, top: 2, bottom: 2 },
cornerRadius: 6,
label: text(layer, "sans", { size: "sm" }),
keystroke: {
...text(layer, "sans", "variant", {
size: "sm",
weight: "bold",
}),
padding: { left: 3, right: 3 },
}
}, state: {
hovered: {
background: background(layer, "hovered"),
label: text(layer, "sans", "hovered", { size: "sm" }),
keystroke: {
...text(layer, "sans", "hovered", {
size: "sm",
weight: "bold",
}),
padding: { left: 3, right: 3 },
},
}
}
}), {
default: {
background: background(layer, "active"),
},
hovered: {
background: background(layer, "active"),
},
}),
let layer = colorScheme.middle
return {
background: background(layer),
cornerRadius: 10,
padding: 4,
shadow: colorScheme.popoverShadow,
border: border(layer),
keystrokeMargin: 30,
item: toggleable(interactive({
base: {
iconSpacing: 8,
iconWidth: 14,
padding: { left: 6, right: 6, top: 2, bottom: 2 },
cornerRadius: 6,
label: text(layer, "sans", { size: "sm" }),
keystroke: {
...text(layer, "sans", "variant", {
size: "sm",
weight: "bold",
}),
padding: { left: 3, right: 3 },
}
}, state: {
hovered: {
background: background(layer, "hovered"),
label: text(layer, "sans", "hovered", { size: "sm" }),
keystroke: {
...text(layer, "sans", "hovered", {
size: "sm",
weight: "bold",
}),
padding: { left: 3, right: 3 },
},
}
}
}), {
default: {
background: background(layer, "active"),
},
hovered: {
background: background(layer, "active"),
},
}),
separator: {
background: borderColor(layer),
margin: { top: 2, bottom: 2 },
},
}
separator: {
background: borderColor(layer),
margin: { top: 2, bottom: 2 },
},
}
}