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