purpleish.css (1955B)
1 /* Set main colours for the purpleish theme */
2 :root {
3 --text-primary: #1d1e26;
4 --text-primary-inverted: #dcdcdc;
5 --text-secondary: #3f426c;
6 --text-muted: #1d1e2699;
7
8 --bg-primary: #fcfcfc;
9 --bg-hover: #e3e3d9;
10 --bg-transparent: #fcfcfc80;
11 --bg-icon-menu: #f8f8f2;
12
13 --bg-accent-code: var(--bg-icon-menu);
14 --bg-accent-pre: var(--bg-accent-code);
15 --bg-input: var(--bg-icon-menu);
16 --bg-label: var(--bg-icon-menu);
17
18 --semantic-primary: #7277cf;
19 --semantic-affirmative: var(--semantic-primary);
20 --semantic-negative: #ff0000;
21 --semantic-dangerous: #ff0000;
22 --semantic-dangerous-hover: #cc0000;
23
24 --color-blue: var(--semantic-primary);
25 --color-purple: var(--semantic-primary);
26 --color-yellow: var(--semantic-primary);
27
28 --border-color: var(--text-secondary);
29 --anchor-color: var(--semantic-primary);
30 }
31
32 /* Dark colours for the purpleish theme */
33 @media (prefers-color-scheme: dark) {
34 :root
35 {
36 --text-primary: #dcdcdc;
37 --text-primary-inverted: #1d1e26;
38 --text-secondary: #dcdcdc99;
39 --text-muted: #dcdcdc80;
40
41 --bg-primary: #212121;
42 --bg-hover: #21212120;
43 --bg-transparent: #21212180;
44 --bg-icon-menu: #2b2b2b;
45 }
46 }
47
48 /* Style Posts and Post Threads as Cards */
49 section.ui.feed > turbo-frame {
50 border-radius: 10px;
51 background-color: var(--bg-icon-menu) !important;
52 margin-top: 0.5em !important;
53 margin-bottom: 0.5em !important;
54 padding: 0.5em !important;
55 box-shadow: 3px 3px 10px #00000080;
56 }
57
58 /* Style Pagination Buttons */
59 .ui.secondary.pagination.menu > a {
60 border-radius: 5px;
61 background-color: var(--bg-icon-menu) !important;
62 box-shadow: 3px 3px 10px #00000080;
63 }
64
65 /* Style Navigation bars */
66 nav {
67 background-color: var(--bg-icon-menu) !important;
68 }
69 nav > div > a,
70 nav > div > .right.menu > form > div > input,
71 nav > div > span.link,
72 nav > div > div.right > a
73 {
74 color: var(--text-primary) !important;
75 }
