1import { ColorScheme } from "../theme/colorScheme"
 2import { background, border, foreground, text } from "./components"
 3import { interactive } from "../element/interactive"
 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            }, state: {
30                hovered: {
31                    ...text(layer, "sans", "default", { size: "xs" }),
32                    background: background(layer, "hovered"),
33                    border: border(layer, "active"),
34                },
35            }
36        }),
37        dismissButton: interactive({
38            base: {
39                color: foreground(layer),
40                iconWidth: 8,
41                iconHeight: 8,
42                buttonWidth: 8,
43                buttonHeight: 8,
44            }, state: {
45                hovered: {
46                    color: foreground(layer, "hovered"),
47                },
48            }
49        })
50    }
51}