mastodon.css (1225B)
1 /* Set main colours */
2 :root {
3 --text-primary: #181821;
4 --text-primary-inverted: #ffffff;
5 --text-secondary: #545778;
6 --text-muted: var(--text-secondary);
7 --text-nav-bar:var(--text-primary);
8
9 --bg-primary: #ffffff;
10 --bg-hover: #f6f6f8;
11 --bg-transparent: #ffffff80;
12 --bg-icon-menu: #f6f6f8;
13 --bg-nav-bar:var(--bg-icon-menu);
14
15 --bg-accent-code: var(--bg-icon-menu);
16 --bg-accent-pre: var(--bg-accent-code);
17 --bg-input: var(--bg-icon-menu);
18 --bg-label: var(--bg-icon-menu);
19
20 --semantic-primary: #6147e6;
21
22 --color-blue: #6147e6;
23 --border-color: #dcdcde;
24
25 --anchor-color: #8b8dac;
26 }
27
28 /* Dark colours */
29 @media (prefers-color-scheme: dark) {
30 :root
31 {
32 color-scheme: dark;
33
34 --text-primary: #f0f1ff;
35 --text-primary-inverted: #181821;
36 --text-secondary: #8b8dac;
37 --text-muted: var(--text-secondary);
38
39 --bg-primary: #181821;
40 --bg-hover: #262632;
41 --bg-transparent: #18182180;
42 --bg-icon-menu: #262632;
43
44 }
45 }
46
47 /* Workarounds */
48 .ui.segment {
49 background: var(--bg-primary);
50 }
51 .ui.button {
52 background: var(--bg-hover);
53 color: var(--text-primary);
54 }
55 .ui.button.active,
56 .ui.form .editors .button.toggle.active
57 {
58 background: var(--semantic-primary) !important;
59 }