-
Notifications
You must be signed in to change notification settings - Fork 0
/
theme.ts
48 lines (38 loc) · 1.42 KB
/
theme.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import { buildLegacyTheme } from "sanity"
const props = {
"--brand": "#AA1945", // Rose red
"--my-text": "#F9CCD3", // Rose Quartz
"--my-bg": "#67595E", // Coffee Pot
"--my-button": "#E8B4B8",
"--my-hover-bg": "#EED6D3",
"--my-focus": "#F9CCD3",
"--my-red": "#E42256", // red error
"--my-yellow": "#FEC84D", //yellow warning
"--my-green": "#00B1B0" // success
}
export const myTheme = buildLegacyTheme({
/* Base theme colors */
"--black": props["--my-bg"],
"--white": props["--my-text"],
"--gray": "#FFF",
"--gray-base": "#fff",
"--component-bg": props["--my-bg"],
"--component-text-color": props["--my-text"],
/* Brand */
"--brand-primary": props["--brand"],
// Default button
"--default-button-color": props["--my-hover-bg"],
"--default-button-primary-color": props["--my-button"],
"--default-button-success-color": props["--my-green"],
"--default-button-warning-color": props["--my-yellow"],
"--default-button-danger-color": props["--my-red"],
/* State */
"--state-info-color": props["--brand"],
"--state-success-color": props["--my-green"],
"--state-warning-color": props["--my-yellow"],
"--state-danger-color": props["--my-red"],
/* Navbar */
"--main-navigation-color": props["--my-bg"],
"--main-navigation-color--inverted": props["--my-text"],
"--focus-color": props["--my-focus"],
});