Skip to content
This repository was archived by the owner on Apr 22, 2025. It is now read-only.

Commit 974f629

Browse files
Androser420Androser420
committed
Added 2 more themes
1 parent 06032d1 commit 974f629

File tree

3 files changed

+189
-0
lines changed

3 files changed

+189
-0
lines changed

‎theme/flavors/rosepine/main.theme.css

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
/**
2+
* @name sysmol24 (rosepine)
3+
* @description Based on the rosepine color scheme.
4+
* @author smg8, refact0r, darkthemer
5+
* @version 1.0.0
6+
* @website https://github.com/Androser420/sysmol24
7+
* @source https://github.com/Androser420/sysmol24/blob/main/theme/flavors/rosepine/main.theme.css
8+
* @authorId 1106858419861864489
9+
*/
10+
11+
/* flavors */
12+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/src/main.css');
13+
14+
/* modules */
15+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/theme/modules/indirect-fixes.css');
16+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/theme/modules/chat-indicators.css');
17+
18+
/* customize things here */
19+
:root {
20+
--font: 'DM Mono'; /* UI font name. it must be installed on your system. */
21+
letter-spacing: 0; /* decreases letter spacing for better readability. */
22+
font-weight: 400; /* UI font weight. */
23+
--label-font-weight: 400; /* font weight for panel labels. */
24+
--corner-text: 'rosepine24'; /* custom text to display in the corner. only works on windows. */
25+
--pad: 16px; /* padding between panels. */
26+
--txt-pad: 10px; /* padding inside panels to prevent labels from clipping */
27+
--panel-roundness: 0px; /* corner roundness of panels. ONLY WORKS IF unrounding.css IS REMOVED (see above). */
28+
29+
/* background colors */
30+
--bg-0: #191724; /* main background color. */
31+
--bg-1: #1f1d2e; /* background color for secondary elements like code blocks, embeds, etc. */
32+
--bg-2: #26233a; /* color of neutral buttons. */
33+
--bg-3: #403d52; /* color of neutral buttons when hovered. */
34+
35+
/* state modifiers */
36+
--hover: color-mix(in srgb, var(--bg-3), transparent 60%); /* color of hovered elements. */
37+
--active: color-mix(in srgb, var(--bg-3), transparent 80%); /* color of elements when clicked. */
38+
--selected: var(--active); /* color of selected elements. */
39+
40+
/* text colors */
41+
--txt-dark: var(--bg-0); /* color of dark text on colored backgrounds. */
42+
--txt-link: var(--rose); /* color of links. */
43+
--txt-0: #ffffff; /* color of bright/white text. */
44+
--txt-1: #e0def4; /* main text color. */
45+
--txt-2: #908caa; /* color of secondary text like channel list. */
46+
--txt-3: #6e6a86; /* color of muted text. */
47+
48+
/* accent colors */
49+
--acc-0: var(--rose); /* main accent color. */
50+
--acc-1: var(--rose-1); /* color of accent buttons when hovered. */
51+
--acc-2: var(--rose-2); /* color of accent buttons when clicked. */
52+
53+
/* borders */
54+
--border-width: 2px; /* panel border thickness. */
55+
--border-color: var(--bg-2); /* panel border color. */
56+
--border-hover-color: var(--acc-0); /* panel border color when hovered. */
57+
--border-transition: 0.2s ease; /* panel border transition. */
58+
59+
/* status dot colors */
60+
--online-dot: var(--green); /* color of online dot. */
61+
--dnd-dot: var(--pink); /* color of do not disturb dot. */
62+
--idle-dot: var(--yellow); /* color of idle dot. */
63+
--streaming-dot: var(--purple); /* color of streaming dot. */
64+
65+
/* mention/ping and message colors */
66+
--mention-txt: var(--acc-0); /* color of mention text. */
67+
--mention-bg: color-mix(in oklch, var(--acc-0), transparent 90%); /* background highlight of mention text. */
68+
--mention-overlay: color-mix(in oklch, var(--acc-0), transparent 90%); /* overlay color of messages that mention you. */
69+
--mention-hover-overlay: color-mix(in oklch, var(--acc-0), transparent 95%); /* overlay color of messages that mention you when hovered. */
70+
--reply-overlay: var(--active); /* overlay color of message you are replying to. */
71+
--reply-hover-overlay: var(--hover); /* overlay color of message you are replying to when hovered. */
72+
73+
/* color shades */
74+
--pink: oklch(69.77% 0.1565 4.22);
75+
--pink-1: oklch(59.77% 0.1565 4.22);
76+
--pink-2: oklch(49.77% 0.1565 4.22);
77+
--purple: oklch(77.6% 0.0945 304.99);
78+
--purple-1: oklch(67.6% 0.0945 304.99);
79+
--purple-2: oklch(57.6% 0.0945 304.99);
80+
--cyan: oklch(52.77% 0.0793 227.72);
81+
--yellow: oklch(84.29% 0.11 74.6);
82+
--green: oklch(82.19% 0.0543 209.56);
83+
--green-1: oklch(72.19% 0.0543 209.56);
84+
--green-2: oklch(62.19% 0.0543 209.56);
85+
--rose: oklch(83.63% 0.0544 21.14);
86+
--rose-1: oklch(73.63% 0.0544 21.14);
87+
--rose-2: oklch(63.63% 0.0544 21.14);
88+
}

‎theme/flavors/tokyo-night/main.theme.css

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
/**
2+
* @name sysmol24 (tokyo-night)
3+
* @description Based on tokyo-night color scheme.
4+
* @author smg8, refact0r, pixza_Yaoita
5+
* @version 1.0.0
6+
* @website https://github.com/Androser420/sysmol24
7+
* @source https://github.com/Androser420/sysmol24/blob/main/theme/flavors/tokyo-night/main.theme.css
8+
* @authorId 1106858419861864489
9+
*/
10+
11+
/* flavors */
12+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/src/main.css');
13+
14+
/* modules */
15+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/theme/modules/indirect-fixes.css');
16+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/theme/modules/chat-indicators.css');
17+
18+
/* theme overrides */
19+
@import url('https://raw.githubusercontent.com/Androser420/sysmol24/refs/heads/main/theme/flavors/tokyo-night/overrides.css');
20+
21+
/* customize things here */
22+
:root {
23+
--font: 'DM Mono'; /* UI font name. it must be installed on your system. */
24+
letter-spacing: -0.05ch; /* decreases letter spacing for better readability. */
25+
font-weight: 300; /* UI font weight. */
26+
--label-font-weight: 500; /* font weight for panel labels. */
27+
--corner-text: 'tokyo24'; /* custom text to display in the corner. only works on windows. */
28+
--pad: 18px; /* padding between panels. */
29+
--txt-pad: 10px; /* padding inside panels to prevent labels from clipping */
30+
--panel-roundness: 0px; /* corner roundness of panels. ONLY WORKS IF unrounding.css IS REMOVED (see above). */
31+
32+
/* background colors */
33+
--bg-0: oklch(20% 0.02 285); /* main background color. */
34+
--bg-1: oklch(24% 0.03 275); /* background color for secondary elements like code blocks, embeds, etc. */
35+
--bg-2: oklch(28% 0.05 275); /* color of neutral buttons. */
36+
--bg-3: oklch(32% 0.05 273); /* color of neutral buttons when hovered. */
37+
38+
/* state modifiers */
39+
--hover: oklch(54% 0.02 285 / 0.1); /* color of hovered elements. */
40+
--active: oklch(64% 0.10 18.5 / 0.2); /* color of elements when clicked. */
41+
--selected: var(--active); /* color of selected elements. */
42+
43+
/* text colors */
44+
--txt-dark: var(--txt-0); /* color of white text on colored backgrounds. */
45+
--txt-link: var(--cyan); /* color of links. */
46+
--txt-0: oklch(88% 0.06 275); /* color of bright/white text. */
47+
--txt-1: oklch(76% 0.05 275); /* main text color. */
48+
--txt-2: oklch(58% 0.05 275); /* color of secondary text like channel list. */
49+
--txt-3: oklch(38% 0.05 275); /* color of muted text. */
50+
51+
/* accent colors */
52+
--acc-0: var(--blurple); /* main accent color. */
53+
--acc-1: var(--blurple-1); /* color of accent buttons when hovered. */
54+
--acc-2: var(--blurple-2); /* color of accent buttons when clicked. */
55+
56+
/* borders */
57+
--border-width: 1px; /* panel border thickness. */
58+
--border-color: var(--bg-3); /* panel border color. */
59+
--border-hover-color: var(--acc-0); /* panel border color when hovered. */
60+
--border-transition: 0.2s ease; /* panel border transition. */
61+
62+
/* status dot colors */
63+
--online-dot: var(--green); /* color of online dot. */
64+
--dnd-dot: var(--pink); /* color of do not disturb dot. */
65+
--idle-dot: var(--yellow); /* color of idle dot. */
66+
--streaming-dot: var(--purple); /* color of streaming dot. */
67+
68+
/* mention/ping and message colors */
69+
--mention-txt: var(--acc-0); /* color of mention text. */
70+
--mention-bg: color-mix(in oklch, var(--acc-0), transparent 90%); /* background highlight of mention text. */
71+
--mention-overlay: color-mix(in oklch, var(--acc-0), transparent 90%); /* overlay color of messages that mention you. */
72+
--mention-hover-overlay: color-mix(in oklch, var(--acc-0), transparent 95%); /* overlay color of messages that mention you when hovered. */
73+
--reply-overlay: var(--active); /* overlay color of message you are replying to. */
74+
--reply-hover-overlay: var(--hover); /* overlay color of message you are replying to when hovered. */
75+
76+
/* color shades */
77+
--pink: oklch(72% 0.16 10.5);
78+
--pink-1: oklch(62% 0.16 10.5);
79+
--pink-2: oklch(52% 0.16 10.5);
80+
--purple: oklch(75% 0.135 300);
81+
--purple-1: oklch(65% 0.135 300);
82+
--purple-2: oklch(55% 0.135 300);
83+
--blurple: oklch(64% 0.20 275);
84+
--blurple-1: oklch(72% 0.20 275);
85+
--blurple-2: oklch(56% 0.20 275);
86+
--cyan: oklch(82% 0.105 235);
87+
--yellow: oklch(78% 0.105 75.5);
88+
--green: oklch(79% 0.14 130);
89+
--green-1: oklch(69% 0.14 130);
90+
--green-2: oklch(59% 0.14 130);
91+
}

‎theme/flavors/tokyo-night/overrides.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.theme-dark,
2+
html.theme-light {
3+
--__spoiler-warning-text-color: var(--txt-1);
4+
--__spoiler-warning-text-color--hover: var(--txt-0);
5+
}
6+
7+
::selection {
8+
background-color: #2f3549;
9+
color: #c87779;
10+
}

0 commit comments

Comments
 (0)