simple_message_notification.ts

 1import { ColorScheme } from "../theme/color_scheme"
 2import { background, border, foreground, text } from "./components"
 3import { interactive } from "../element"
 4
 5export default function simple_message_notification(theme: ColorScheme): any {
 6    const header_padding = 8
 7
 8    return {
 9        message: {
10            ...text(theme.middle, "sans", { size: "xs" }),
11            margin: { left: header_padding, right: header_padding },
12        },
13        action_message: interactive({
14            base: {
15                ...text(theme.middle, "sans", { size: "xs" }),
16                border: border(theme.middle, "active"),
17                corner_radius: 4,
18                padding: {
19                    top: 3,
20                    bottom: 3,
21                    left: 7,
22                    right: 7,
23                },
24
25                margin: { left: header_padding, top: 6, bottom: 6 },
26            },
27            state: {
28                hovered: {
29                    ...text(theme.middle, "sans", "default", { size: "xs" }),
30                    background: background(theme.middle, "hovered"),
31                    border: border(theme.middle, "active"),
32                },
33            },
34        }),
35        dismiss_button: interactive({
36            base: {
37                color: foreground(theme.middle),
38                icon_width: 8,
39                icon_height: 8,
40                button_width: 8,
41                button_height: 8,
42            },
43            state: {
44                hovered: {
45                    color: foreground(theme.middle, "hovered"),
46                },
47            },
48        }),
49    }
50}