1import { ColorScheme } from "../themes/common/colorScheme"
2import { background, foreground, text } from "./components"
3
4const avatarSize = 12
5const headerPadding = 8
6
7export default function contactNotification(colorScheme: ColorScheme): Object {
8 let layer = colorScheme.lowest
9 return {
10 headerAvatar: {
11 height: avatarSize,
12 width: avatarSize,
13 cornerRadius: 6,
14 },
15 headerMessage: {
16 ...text(layer, "sans", { size: "xs" }),
17 margin: { left: headerPadding, right: headerPadding },
18 },
19 headerHeight: 18,
20 bodyMessage: {
21 ...text(layer, "sans", { size: "xs" }),
22 margin: { left: avatarSize + headerPadding, top: 6, bottom: 6 },
23 },
24 button: {
25 ...text(layer, "sans", "on", { size: "xs" }),
26 background: background(layer, "on"),
27 padding: 4,
28 cornerRadius: 6,
29 margin: { left: 6 },
30 hover: {
31 background: background(layer, "on", "hovered"),
32 },
33 },
34 dismissButton: {
35 color: foreground(layer, "variant"),
36 iconWidth: 8,
37 iconHeight: 8,
38 buttonWidth: 8,
39 buttonHeight: 8,
40 hover: {
41 color: foreground(layer, "hovered"),
42 },
43 },
44 }
45}