1import { ColorScheme } from "../theme/colorScheme"
 2import { background, border, foreground, text } from "./components"
 3import { interactive } from "../element"
 4
 5const headerPadding = 8
 6
 7export default function simpleMessageNotification(
 8    colorScheme: ColorScheme
 9): Object {
10    let layer = colorScheme.middle
11    return {
12        message: {
13            ...text(layer, "sans", { size: "xs" }),
14            margin: { left: headerPadding, right: headerPadding },
15        },
16        actionMessage: interactive({
17            base: {
18                ...text(layer, "sans", { size: "xs" }),
19                border: border(layer, "active"),
20                cornerRadius: 4,
21                padding: {
22                    top: 3,
23                    bottom: 3,
24                    left: 7,
25                    right: 7,
26                },
27
28                margin: { left: headerPadding, top: 6, bottom: 6 },
29            },
30            state: {
31                hovered: {
32                    ...text(layer, "sans", "default", { size: "xs" }),
33                    background: background(layer, "hovered"),
34                    border: border(layer, "active"),
35                },
36            },
37        }),
38        dismissButton: interactive({
39            base: {
40                color: foreground(layer),
41                iconWidth: 8,
42                iconHeight: 8,
43                buttonWidth: 8,
44                buttonHeight: 8,
45            },
46            state: {
47                hovered: {
48                    color: foreground(layer, "hovered"),
49                },
50            },
51        }),
52    }
53}