feedback.ts

 1import { ColorScheme } from "../theme/colorScheme"
 2import { background, border, text } from "./components"
 3import { interactive } from "./interactive"
 4
 5export default function feedback(colorScheme: ColorScheme) {
 6  let layer = colorScheme.highest
 7
 8  return {
 9    submit_button: interactive({
10      base: {
11        ...text(layer, "mono", "on"),
12        background: background(layer, "on"),
13        cornerRadius: 6,
14        border: border(layer, "on"),
15        margin: {
16          right: 4,
17        },
18        padding: {
19          bottom: 2,
20          left: 10,
21          right: 10,
22          top: 2,
23        }
24      }, state: {
25        clicked: {
26          ...text(layer, "mono", "on", "pressed"),
27          background: background(layer, "on", "pressed"),
28          border: border(layer, "on", "pressed"),
29        },
30        hovered: {
31          ...text(layer, "mono", "on", "hovered"),
32          background: background(layer, "on", "hovered"),
33          border: border(layer, "on", "hovered"),
34        },
35      }
36    }),
37    button_margin: 8,
38    info_text_default: text(layer, "sans", "default", { size: "xs" }),
39    link_text_default: text(layer, "sans", "default", {
40      size: "xs",
41      underline: true,
42    }),
43    link_text_hover: text(layer, "sans", "hovered", {
44      size: "xs",
45      underline: true,
46    }),
47  }
48}