forked from schnensch0/zelk
-
Notifications
You must be signed in to change notification settings - Fork 0
/
zelk.css
152 lines (147 loc) · 5.54 KB
/
zelk.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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
/* ▀▀█ █▀▀ █ █ █
▄▀ █▀▀ █ █▀▄
▀▀▀ ▀▀▀ ▀▀▀ ▀ ▀ */
/*--------------IMPORTS------------- */
@import url(https://raw.githack.com/schnensch0/zelk/main/main.css);
@import url(https://raw.githack.com/snappercord/Settings-Icons/main/settingsicons.css);
/*--------------COLORS---------------*/
/*------remove / and * to apply------*/
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/blue.css); */
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/green.css); */
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/gray.css); */
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/orange.css); */
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/purple.css); */
/* @import url(https://raw.githack.com/schnensch0/zelk/main/colors/red.css); */
/*-------------VARIABLES-------------*/
:root {
/* set to 'unset' to show */
--scrollbars: none;
/* profile notes */
--notes: none;
/* direct message box */
--message: none;
/* set to 'Inter', sans-serif !important to use Inter font*/
--font-primary: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-display: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
--border-radius-1: 10px;
--border-radius-2: 8px;
}
/*-----------CUSTOM COLORS-----------*/
/*-------------DARK MODE-------------*/
/*---------------BASIC---------------*/
.theme-dark {
--accent-color: #bde6fb;
--background-1: #171d20;
--background-2: #1e2529;
--background-accent: #1e2529;
--border-color: #273034;
}
/*-------------ADVANCED--------------*/
.theme-dark {
/* background */
--background-primary: var(--background-1);
--background-primary-alt: var(--background-1);
--background-secondary: var(--background-1);
--background-secondary-alt: var(--background-1);
--background-tertiary: var(--background-2);
--background-accent-gradient: var(--background-2);
--background-floating: var(--background-1);
--background-mentioned: #bde6fb10;
--background-mentioned-hover: #bde6fb15;
/* modifiers */
--background-modifier-hover: #262e33;
--background-modifier-active: #495a63;
--background-modifier-selected: var(--accent-color);
--background-modifier-accent: transparent;
--background-message-hover: transparent;
/* text */
--text-normal: var(--accent-color);
--text-positive: var(--text-normal);
--text-muted: #6d8692;
--text-link: #edf8fe;
--interactive-selected: var(--background-primary);
--interactive-active: var(--text-normal);
--interactive-normal: var(--text-normal);
--interactive-muted: var(--button-background-active);
--channels-default: var(--text-muted);
--header-primary: var(--text-normal);
--header-secondary: var(--text-muted);
/* more */
--settings-icon-color: #8eacbc;
--control-brand-foreground: var(--accent-color);
--info-warning-foreground: var(--accent-color);
--tab-selected: #354249;
--switch: #3d4c53;
--activity-card-background: var(--background-1);
--brand-experiment: var(--accent-color) !important;
/* buttons */
--button-background: #2a3439;
--button-background-hover: #354249;
--button-background-active: #4d5f68;
--button-accent: var(--accent-color);
--button-accent-hover: #d2f3ff;
--button-accent-active: #8dd4f8;
--button-destructive: #fb7c7c;
--button-destructive-hover: #ff929b;
--button-destructive-active: #fa4a4a;
}
/*-------------LIGHT MODE------------*/
/*---------------BASIC---------------*/
.theme-light {
--accent-color: #22c5fd;
--background-1: #ffffff;
--background-2: #f5f7fa;
--background-accent: var(--background-2);
--border-color: transparent;
}
/*-------------ADVANCED--------------*/
.theme-light {
/* background */
--background-primary: var(--background-1);
--background-primary-alt: var(--background-1);
--background-secondary: var(--background-1);
--background-secondary-alt: var(--background-1);
--background-tertiary: var(--background-2);
--background-accent-gradient: var(--background-2);
--background-floating: var(--background-1);
--background-mentioned: #22c5fd10;
--background-mentioned-hover: #22c5fd15;
/* modifiers */
--background-modifier-hover: transparent;
--background-modifier-active: #b7c2cc;
--background-modifier-selected: var(--accent-color);
--background-modifier-accent: transparent;
--background-message-hover: transparent;
/* text */
--text-normal: #123354;
--text-positive: var(--text-normal);
--text-muted: #8495a7;
--text-link: #15a6f0;
--interactive-selected: var(--background-primary);
--interactive-active: var(--text-normal);
--interactive-normal: var(--text-normal);
--interactive-muted: var(--text-muted);
--channels-default: var(--text-normal);
--header-primary: var(--text-normal);
--header-secondary: var(--text-muted);
/* more */
--settings-icon-color: #566e86;
--control-brand-foreground: var(--accent-color);
--info-warning-foreground: var(--accent-color);
--tab-selected: var(--background-1);
--switch: #c8d0d9;
--activity-card-background: var(--background-1);
--brand-experiment: var(--accent-color) !important;
/* buttons */
--button-background: var(--background-1);
--button-background-hover: #d3dae1;
--button-background-active: #b1bcc8;
--button-accent: var(--accent-color);
--button-accent-hover: #22c5fd;
--button-accent-active: #0d87c5;
--button-destructive: #fb7c7c;
--button-destructive-hover: #ff929b;
--button-destructive-active: #fa4a4a;
}
/*-----------DON'T CHANGE------------*/
:root{--outdated:none!important}