-
Notifications
You must be signed in to change notification settings - Fork 0
/
variables.css
95 lines (86 loc) · 2.63 KB
/
variables.css
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
:root,
:root.tokyo-night {
/** colors */
--color-name: tokyo;
--color-bg-shade: #252A33;
--color-bg-base: #282828;
--color-bg-surface: #3c3836;
--color-bg-highlight: #40495A;
--color-fg-shade: #768CB2;
--color-fg-base: #A6B4CD;
--color-fg-surface: #FBF1C7;
--color-fg-highlight: #FFFFFF;
--color-primary-bg: #2C4948;
--color-primary-base: #FE8019;
--color-primary-fg: #B8BB26;
--color-secondary-bg: #25394C;
--color-secondary-base: #4A7197;
--color-secondary-fg: #8BA9C6;
--color-palette-red: #FB4934;
--color-palette-green: #B8BB26;
--color-palette-yellow: #FABD2F;
--color-palette-blue: #83A598;
--color-palette-purple: #D3869B;
--color-palette-cyan: #8EC07C;
--color-palette-orange: #FE8019;
--color-link: #D5C4A1;
/** general */
--font-family: Quicksand;
--font-size: 1;
--display-image: block;
/** surface */
--surface-maxWidth: 1000px;
--surface-shadow: 12px 12px 0px rgba(254, 128, 25, 0.3), 24px 24px 0px rgba(250, 189, 47, 0.3), 36px 36px 0px rgba(184, 187, 38, 0.3), 48px 48px 0px rgba(142, 192, 124, 0.3), 60px 60px 0px rgba(131, 165, 152, 0.2);
--surface-borderRadius: 0px;
/** spacing */
--space-smallest: 0.125rem;
--space-small: 0.5rem;
--space-medium: 1rem;
--space-large: 1.5rem;
--space-largest: 3rem;
/** others */
--picture-size: 300px;
--group-count: 4;
}
:root.gruvbox {
--color-name: tokyo;
--color-bg-shade: #252A33;
--color-bg-base: #1D2021;
--color-bg-surface: #282828;
--color-bg-highlight: #40495A;
--color-fg-shade: #768CB2;
--color-fg-base: #A6B4CD;
--color-fg-surface: #D6DCE8;
--color-fg-highlight: #FFFFFF;
--color-primary-bg: #2C4948;
--color-primary-base: #c0caf5;
--color-primary-fg: #bb9af7;
--color-secondary-bg: #25394C;
--color-secondary-base: #4A7197;
--color-secondary-fg: #8BA9C6;
--color-palette-red: #f7768e;
--color-palette-green: #9ece6a;
--color-palette-yellow: #e0af68;
--color-palette-blue: #7aa2f7;
--color-palette-purple: #bb9af7;
--color-palette-cyan: #b4f9f8;
--color-palette-orange: #ff9e64;
--color-link: #a9b1d6;
/** general */
--font-family: Quicksand;
--font-size: 1;
--display-image: block;
/** surface */
--surface-maxWidth: 1000px;
--surface-shadow: 12px 12px 0px rgba(169, 177, 214, 0.3), 24px 24px 0px rgba(154, 165, 206, 0.3), 36px 36px 0px rgba(86, 95, 137, 0.3), 48px 48px 0px rgba(65, 72, 104, 0.3), 60px 60px 0px rgba(36, 40, 59);
--surface-borderRadius: 0px;
/** spacing */
--space-smallest: 0.125rem;
--space-small: 0.5rem;
--space-medium: 1rem;
--space-large: 1.5rem;
--space-largest: 3rem;
/** others */
--picture-size: 300px;
--group-count: 4;
}