openstatus.dev
Openstatus
www.openstatus.dev
fix: dracula theme (#1529)
authored by
Maximilian Kaske
and committed by
GitHub
63fd6e1e
12742b3c
+56
-32
+56
-32
packages/theme-store/src/dracula.ts
+56
-32
packages/theme-store/src/dracula.ts
···
1
+
// https://draculatheme.com/spec
2
+
1
3
import type { Theme } from "./types";
2
4
3
5
export const DRACULA_THEME = {
···
5
7
name: "Dracula",
6
8
author: { name: "@thibaultleouay", url: "https://thibaultleouay.dev" },
7
9
light: {
8
-
"--background": "#FFFBEB",
9
-
"--foreground": "#1F1F1F",
10
-
"--border": "#6C664B",
11
-
"--input": "oklch(92.2% 0 0)",
12
-
"--primary": "oklch(20.5% 0 0)",
13
-
"--primary-foreground": "oklch(98.5% 0 0)",
14
-
"--secondary": "oklch(97% 0 0)",
15
-
"--secondary-foreground": "oklch(20.5% 0 0)",
16
-
"--muted": "oklch(97% 0 0)",
17
-
"--muted-foreground": "oklch(55.6% 0 0)",
18
-
"--accent": "oklch(97% 0 0)",
19
-
"--accent-foreground": "oklch(20.5% 0 0)",
20
-
"--success": "#14710a",
21
-
"--destructive": "#cb3a2a",
22
-
"--warning": "#A34D14",
23
-
"--info": "#036A96",
10
+
"--background": "#FFFBEB", // Background
11
+
"--foreground": "#1F1F1F", // Foreground
12
+
"--border": "#6C664B", // Current Line
13
+
"--input": "var(--border)", // Current Line
14
+
15
+
"--primary": "var(--foreground)",
16
+
"--primary-foreground": "var(--background)",
17
+
"--secondary": "var(--muted)",
18
+
"--secondary-foreground": "var(--accent-foreground)",
19
+
"--muted": "#CFCFDE", // Section
20
+
"--muted-foreground": "#6C664B", // NOTE: non standard color for improved readability
21
+
"--accent": "var(--muted)",
22
+
"--accent-foreground": "var(--foreground)",
23
+
24
+
"--success": "#14710a", // Green
25
+
"--destructive": "#cb3a2a", // Red
26
+
"--warning": "#A34D14", // Orange
27
+
"--info": "#036A96", // Blue
28
+
29
+
"--chart-1": "#A3144D", // Pink
30
+
"--chart-2": "#A34D14", // Orange
31
+
"--chart-3": "#846E15", // Yellow
32
+
"--chart-4": "#14710a", // Green
33
+
"--chart-5": "#644AC9", // Purple
34
+
24
35
"--popover-foreground": "var(--foreground)",
25
36
"--popover": "var(--background)",
37
+
"--card": "var(--background)",
38
+
"--card-foreground": "var(--foreground)",
26
39
},
27
40
dark: {
28
-
"--background": "#282a36",
29
-
"--foreground": "#f8f8f2",
30
-
"--border": "#6272A4",
31
-
"--input": "oklch(100% 0 0 / 15%)",
32
-
"--primary": "oklch(92.2% 0 0)",
33
-
"--primary-foreground": "oklch(20.5% 0 0)",
34
-
"--secondary": "oklch(26.9% 0 0)",
35
-
"--secondary-foreground": "oklch(98.5% 0 0)",
36
-
"--muted": "oklch(26.9% 0 0)",
37
-
"--muted-foreground": "oklch(70.8% 0 0)",
38
-
"--accent": "oklch(26.9% 0 0)",
39
-
"--accent-foreground": "oklch(98.5% 0 0)",
40
-
"--success": "#50fa7b",
41
-
"--destructive": "#ff5555",
42
-
"--warning": "#ffb86c",
43
-
"--info": "#8BE9FD",
41
+
"--background": "#282a36", // Background
42
+
"--foreground": "#f8f8f2", // Foreground
43
+
"--border": "#6272A4", // Current Line
44
+
"--input": "var(--border)", // Current Line
45
+
46
+
"--primary": "var(--foreground)",
47
+
"--primary-foreground": "var(--background)",
48
+
"--secondary": "var(--muted)",
49
+
"--secondary-foreground": "var(--accent-foreground)",
50
+
"--muted": "#44475A", // Section
51
+
"--muted-foreground": "#A6ACCD", // NOTE: non standard color for improved readability
52
+
"--accent": "var(--muted)",
53
+
"--accent-foreground": "var(--foreground)",
54
+
55
+
"--success": "#50fa7b", // Green
56
+
"--destructive": "#ff5555", // Red
57
+
"--warning": "#ffb86c", // Orange
58
+
"--info": "#8BE9FD", // Blue
59
+
60
+
"--chart-1": "#ff79c6", // Pink
61
+
"--chart-2": "#ffb86c", // Orange
62
+
"--chart-3": "#f1fa8c", // Yellow
63
+
"--chart-4": "#50fa7b", // Green
64
+
"--chart-5": "#bd93f9", // Purple
65
+
44
66
"--popover-foreground": "var(--foreground)",
45
67
"--popover": "var(--background)",
68
+
"--card": "var(--background)",
69
+
"--card-foreground": "var(--foreground)",
46
70
},
47
71
} as const satisfies Theme;