1
 2import { ColorScheme } from "../themes/common/colorScheme";
 3import { border, background, foreground, text } from "./components";
 4
 5
 6export default function welcome(colorScheme: ColorScheme) {
 7  let layer = colorScheme.highest;
 8
 9  // TODO
10  let checkboxBase = {
11    cornerRadius: 4,
12    padding: {
13      left: 3,
14      right: 3,
15      top: 3,
16      bottom: 3,
17    },
18    shadow: colorScheme.popoverShadow,
19    border: border(layer),
20    margin: {
21      left: 8,
22      right: 8,
23      top: 5,
24      bottom: 5
25    },
26  };
27
28  return {
29    button: {
30      background: background(layer),
31      border: border(layer),
32      cornerRadius: 6,
33      margin: {
34        top: 1,
35      },
36      padding: {
37        top: 1,
38        bottom: 1,
39        left: 7,
40        right: 7,
41      },
42      ...text(layer, "sans", "variant", { size: "xs" }),
43      hover: {
44        ...text(layer, "sans", "hovered", { size: "xs" }),
45        background: background(layer, "hovered"),
46        border: border(layer, "hovered"),
47      },
48    },
49    checkbox: {
50      width: 12,
51      height: 12,
52      icon: "icons/check_12.svg",
53      iconColor: foreground(layer, "on"),
54      default: {
55        ...checkboxBase,
56        background: background(layer, "default"),
57        border: {
58          color: foreground(layer, "hovered"),
59          width: 1,
60        }
61      },
62      checked: {
63        ...checkboxBase,
64        background: background(layer, "hovered"),
65        border: {
66          color: foreground(layer, "hovered"),
67          width: 1,
68        }
69      },
70      hovered: {
71        ...checkboxBase,
72        background: background(layer, "hovered"),
73
74        border: {
75          color: foreground(layer, "hovered"),
76          width: 1,
77        }
78      },
79      hoveredAndChecked: {
80        ...checkboxBase,
81        background: background(layer, "hovered"),
82        border: {
83          color: foreground(layer, "hovered"),
84          width: 1,
85        }
86      }
87    }
88  }
89}