Skip to content

Commit a7685d2

Browse files
norajnoraj
authored
(themes) add Cybertopia themes (#4124)
1 parent 7893353 commit a7685d2

File tree

5 files changed

+389
-0
lines changed

5 files changed

+389
-0
lines changed

‎CHANGES.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,10 @@ Developer Tools:
5151
Themes:
5252

5353
- Added `Rosé Pine` theme [William Wilkinson][]
54+
- Added `Cybertopia Cherry` theme [Alexandre ZANNI][]
55+
- Added `Cybertopia Dimmer` theme [Alexandre ZANNI][]
56+
- Added `Cybertopia Icecap` theme [Alexandre ZANNI][]
57+
- Added `Cybertopia Saturated` theme [Alexandre ZANNI][]
5458

5559
Improvements:
5660

@@ -71,6 +75,7 @@ CONTRIBUTORS
7175
[Sainan]: https://github.com/Sainan
7276
[Osmocom]: https://github.com/osmocom
7377
[Álvaro Mondéjar]: https://github.com/mondeja
78+
[Alexandre ZANNI]: https://github.com/noraj
7479
[Barthélémy Bonhomme]: https://github.com/barthy-koeln
7580
[Lavan]: https://github.com/jvlavan
7681
[Somya]: https://github.com/somya-05

‎src/styles/cybertopia-cherry.css

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
/*
2+
Theme: Cybertopia Cherry
3+
Author: Alexandre ZANNI (noraj)
4+
Repository: https://github.com/noraj/cybertopia-highlightjs
5+
*/
6+
7+
:root {
8+
--hljs-bg: #101010;
9+
--hljs-mono-1: #abb2bf;
10+
--hljs-mono-3: #5c6370;
11+
--hljs-hue-1: #C50243;
12+
--hljs-hue-2: #C50253;
13+
--hljs-hue-3: #C50263;
14+
--hljs-hue-4: #02c797;
15+
--hljs-hue-5: #02C584;
16+
--hljs-hue-6: #02C574;
17+
--hljs-hue-6-2: #02C563;
18+
--hljs-hue-7: #C50233;
19+
}
20+
21+
.hljs {
22+
color: var(--hljs-mono-1);
23+
background: var(--hljs-bg)
24+
}
25+
.hljs-comment,
26+
.hljs-quote,
27+
.hljs-code {
28+
color: var(--hljs-mono-3);
29+
font-style: italic
30+
}
31+
.hljs-doctag,
32+
.hljs-keyword,
33+
.hljs-formula,
34+
.hljs-meta .hljs-keyword {
35+
color: var(--hljs-hue-3)
36+
}
37+
.hljs-section,
38+
.hljs-name,
39+
.hljs-selector-tag,
40+
.hljs-deletion,
41+
.hljs-subst {
42+
color: var(--hljs-hue-5)
43+
}
44+
.hljs-literal {
45+
color: var(--hljs-hue-1)
46+
}
47+
.hljs-string,
48+
.hljs-regexp,
49+
.hljs-addition,
50+
.hljs-attribute,
51+
.hljs-meta .hljs-string {
52+
color: var(--hljs-hue-4)
53+
}
54+
.hljs-attr,
55+
.hljs-variable,
56+
.hljs-template-variable,
57+
.hljs-type,
58+
.hljs-selector-class,
59+
.hljs-selector-attr,
60+
.hljs-selector-pseudo,
61+
.hljs-number,
62+
.hljs-punctuation,
63+
.hljs-variable.language_ {
64+
color: var(--hljs-hue-6)
65+
}
66+
.hljs-symbol,
67+
.hljs-bullet,
68+
.hljs-link,
69+
.hljs-meta,
70+
.hljs-selector-id,
71+
.hljs-title,
72+
.hljs-title.function_,
73+
.hljs-property,
74+
.hljs-tag,
75+
.hljs-char.escape_ {
76+
color: var(--hljs-hue-2)
77+
}
78+
.hljs-built_in,
79+
.hljs-title.class_,
80+
.hljs-title.class_.inherited__,
81+
.hljs-class .hljs-title {
82+
color: var(--hljs-hue-6-2)
83+
}
84+
.hljs-emphasis {
85+
font-style: italic
86+
}
87+
.hljs-strong {
88+
font-weight: bold
89+
}
90+
.hljs-link {
91+
text-decoration: underline
92+
}
93+
.hljs-params, .hljs-operator,
94+
.hljs-template-tag {
95+
color: var(--hljs-hue-7)
96+
}

‎src/styles/cybertopia-dimmer.css

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
/*
2+
Theme: Cybertopia Dimmer
3+
Author: Alexandre ZANNI (noraj)
4+
Repository: https://github.com/noraj/cybertopia-highlightjs
5+
*/
6+
7+
:root {
8+
--hljs-bg: #101010;
9+
--hljs-mono-1: #abb2bf;
10+
--hljs-mono-3: #5c6370;
11+
--hljs-hue-1: #97C502;
12+
--hljs-hue-2: #469EBE;
13+
--hljs-hue-3: #A246BE;
14+
--hljs-hue-4: #02c797;
15+
--hljs-hue-5: #C50233;
16+
--hljs-hue-6: #BE6446;
17+
--hljs-hue-6-2: #c5bb02;
18+
--hljs-hue-7: #64BE46;
19+
}
20+
21+
.hljs {
22+
color: var(--hljs-mono-1);
23+
background: var(--hljs-bg)
24+
}
25+
.hljs-comment,
26+
.hljs-quote,
27+
.hljs-code {
28+
color: var(--hljs-mono-3);
29+
font-style: italic
30+
}
31+
.hljs-doctag,
32+
.hljs-keyword,
33+
.hljs-formula,
34+
.hljs-meta .hljs-keyword {
35+
color: var(--hljs-hue-3)
36+
}
37+
.hljs-section,
38+
.hljs-name,
39+
.hljs-selector-tag,
40+
.hljs-deletion,
41+
.hljs-subst {
42+
color: var(--hljs-hue-5)
43+
}
44+
.hljs-literal {
45+
color: var(--hljs-hue-1)
46+
}
47+
.hljs-string,
48+
.hljs-regexp,
49+
.hljs-addition,
50+
.hljs-attribute,
51+
.hljs-meta .hljs-string {
52+
color: var(--hljs-hue-4)
53+
}
54+
.hljs-attr,
55+
.hljs-variable,
56+
.hljs-template-variable,
57+
.hljs-type,
58+
.hljs-selector-class,
59+
.hljs-selector-attr,
60+
.hljs-selector-pseudo,
61+
.hljs-number,
62+
.hljs-punctuation,
63+
.hljs-variable.language_ {
64+
color: var(--hljs-hue-6)
65+
}
66+
.hljs-symbol,
67+
.hljs-bullet,
68+
.hljs-link,
69+
.hljs-meta,
70+
.hljs-selector-id,
71+
.hljs-title,
72+
.hljs-title.function_,
73+
.hljs-property,
74+
.hljs-tag,
75+
.hljs-char.escape_ {
76+
color: var(--hljs-hue-2)
77+
}
78+
.hljs-built_in,
79+
.hljs-title.class_,
80+
.hljs-title.class_.inherited__,
81+
.hljs-class .hljs-title {
82+
color: var(--hljs-hue-6-2)
83+
}
84+
.hljs-emphasis {
85+
font-style: italic
86+
}
87+
.hljs-strong {
88+
font-weight: bold
89+
}
90+
.hljs-link {
91+
text-decoration: underline
92+
}
93+
.hljs-params, .hljs-operator,
94+
.hljs-template-tag {
95+
color: var(--hljs-hue-7)
96+
}

‎src/styles/cybertopia-icecap.css

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
/*
2+
Theme: Cybertopia Icecap
3+
Author: Alexandre ZANNI (noraj)
4+
Repository: https://github.com/noraj/cybertopia-highlightjs
5+
*/
6+
7+
:root {
8+
--hljs-bg: #101010;
9+
--hljs-mono-1: #abb2bf;
10+
--hljs-mono-3: #5c6370;
11+
--hljs-hue-1: #0274C5;
12+
--hljs-hue-2: #025AC5;
13+
--hljs-hue-3: #0240C5;
14+
--hljs-hue-4: #02c797;
15+
--hljs-hue-5: #02C5AE;
16+
--hljs-hue-6: #02C2C5;
17+
--hljs-hue-6-2: #02A8C5;
18+
--hljs-hue-7: #028EC5;
19+
}
20+
21+
.hljs {
22+
color: var(--hljs-mono-1);
23+
background: var(--hljs-bg)
24+
}
25+
.hljs-comment,
26+
.hljs-quote,
27+
.hljs-code {
28+
color: var(--hljs-mono-3);
29+
font-style: italic
30+
}
31+
.hljs-doctag,
32+
.hljs-keyword,
33+
.hljs-formula,
34+
.hljs-meta .hljs-keyword {
35+
color: var(--hljs-hue-3)
36+
}
37+
.hljs-section,
38+
.hljs-name,
39+
.hljs-selector-tag,
40+
.hljs-deletion,
41+
.hljs-subst {
42+
color: var(--hljs-hue-5)
43+
}
44+
.hljs-literal {
45+
color: var(--hljs-hue-1)
46+
}
47+
.hljs-string,
48+
.hljs-regexp,
49+
.hljs-addition,
50+
.hljs-attribute,
51+
.hljs-meta .hljs-string {
52+
color: var(--hljs-hue-4)
53+
}
54+
.hljs-attr,
55+
.hljs-variable,
56+
.hljs-template-variable,
57+
.hljs-type,
58+
.hljs-selector-class,
59+
.hljs-selector-attr,
60+
.hljs-selector-pseudo,
61+
.hljs-number,
62+
.hljs-punctuation,
63+
.hljs-variable.language_ {
64+
color: var(--hljs-hue-6)
65+
}
66+
.hljs-symbol,
67+
.hljs-bullet,
68+
.hljs-link,
69+
.hljs-meta,
70+
.hljs-selector-id,
71+
.hljs-title,
72+
.hljs-title.function_,
73+
.hljs-property,
74+
.hljs-tag,
75+
.hljs-char.escape_ {
76+
color: var(--hljs-hue-2)
77+
}
78+
.hljs-built_in,
79+
.hljs-title.class_,
80+
.hljs-title.class_.inherited__,
81+
.hljs-class .hljs-title {
82+
color: var(--hljs-hue-6-2)
83+
}
84+
.hljs-emphasis {
85+
font-style: italic
86+
}
87+
.hljs-strong {
88+
font-weight: bold
89+
}
90+
.hljs-link {
91+
text-decoration: underline
92+
}
93+
.hljs-params, .hljs-operator,
94+
.hljs-template-tag {
95+
color: var(--hljs-hue-7)
96+
}

0 commit comments

Comments
 (0)