Skip to content

Commit 9386bae

Browse files
sripwoudsripwoud
committed
style: organize theme into modular CSS files
1 parent 437630f commit 9386bae

File tree

11 files changed

+277
-176
lines changed

11 files changed

+277
-176
lines changed

‎theme/custom.css‎

Lines changed: 14 additions & 175 deletions
Original file line numberDiff line numberDiff line change
@@ -1,181 +1,20 @@
1-
@layer typedoc {
2-
:root {
3-
--color-background: #000000;
4-
--color-background-secondary: #000000;
5-
--color-background-active: #27272a;
6-
--color-background-warning: #ebd43e;
7-
--color-warning-text: #111111;
8-
--color-accent: #3f3f46;
9-
--color-active-menu-item: #27272a;
10-
--color-text: #e3e7fb;
11-
--color-contrast-text: #ffffff;
12-
--color-text-aside: #a1a1aa;
13-
--color-icon-background: #111111;
14-
--color-icon-text: #e3e7fb;
15-
--color-comment-tag-text: #e3e7fb;
16-
--color-comment-tag: #27272a;
17-
--color-link: #8367e7;
18-
--color-focus-outline: #b19dff;
19-
--color-ts-keyword: #b19dff;
20-
--color-ts-project: #8367e7;
21-
--color-ts-module: #8367e7;
22-
--color-ts-namespace: #8367e7;
23-
--color-ts-enum: #ebd43e;
24-
--color-ts-enum-member: #ebd43e;
25-
--color-ts-variable: #3ec7eb;
26-
--color-ts-function: #2ecf95;
27-
--color-ts-class: #8367e7;
28-
--color-ts-interface: #2ecf95;
29-
--color-ts-constructor: #8367e7;
30-
--color-ts-property: #eb7c3e;
31-
--color-ts-method: #b19dff;
32-
--color-ts-reference: #8367e7;
33-
--color-ts-call-signature: #b19dff;
34-
--color-ts-index-signature: #eb7c3e;
35-
--color-ts-constructor-signature: #8367e7;
36-
--color-ts-parameter: #3ec7eb;
37-
--color-ts-type-parameter: #eb7c3e;
38-
--color-ts-accessor: #eb7c3e;
39-
--color-ts-get-signature: #eb7c3e;
40-
--color-ts-set-signature: #eb7c3e;
41-
--color-ts-type-alias: #8367e7;
42-
--color-document: #e3e7fb;
43-
--color-alert-note: #3ec7eb;
44-
--color-alert-tip: #2ecf95;
45-
--color-alert-important: #8367e7;
46-
--color-alert-warning: #ebd43e;
47-
--color-alert-caution: #eb7c3e;
48-
--external-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' width='10' height='10'><path fill-opacity='0' stroke='%23e3e7fb' stroke-width='10' d='m43,35H5v60h60V57M45,5v10l10,10-30,30 20,20 30-30 10,10h10V5z'/></svg>");
49-
color-scheme: dark;
50-
--code-background: #000000;
51-
}
1+
/* CSS Variables and Base Settings */
2+
@import './styles/variables.css';
523

53-
body {
54-
position: relative;
55-
overflow-x: hidden;
56-
}
4+
/* Layout and Background */
5+
@import './styles/layout.css';
576

58-
body::before {
59-
content: '';
60-
position: fixed;
61-
bottom: -20%;
62-
left: 50%;
63-
transform: translateX(-50%);
64-
width: 200%;
65-
height: 90vh;
66-
z-index: 0;
67-
background: radial-gradient(ellipse at center, rgba(131, 103, 231, 0.5) 0%, rgba(96, 66, 199, 0.35) 25%, rgba(131, 103, 231, 0.15) 45%, transparent 70%);
68-
pointer-events: none;
69-
}
7+
/* Header and Navigation */
8+
@import './styles/header.css';
709

71-
.tsd-page-content,
72-
main,
73-
.container {
74-
position: relative;
75-
z-index: 1;
76-
}
10+
/* Typography */
11+
@import './styles/typography.css';
7712

78-
html {
79-
background: #000000 !important;
80-
}
13+
/* Links and Navigation */
14+
@import './styles/links.css';
8115

82-
body {
83-
font-family:
84-
'Inter',
85-
system-ui,
86-
'Roboto',
87-
'Segoe UI',
88-
sans-serif;
89-
background: #000000 !important;
90-
}
16+
/* Panels and Containers */
17+
@import './styles/panels.css';
9118

92-
.container,
93-
.container-fluid,
94-
.tsd-page-content,
95-
main {
96-
background: transparent !important;
97-
}
98-
99-
header,
100-
.tsd-page-toolbar,
101-
.tsd-header {
102-
background: #000000 !important;
103-
border-bottom: 1px solid #3f3f46;
104-
}
105-
106-
h1,
107-
h2,
108-
h3,
109-
h4,
110-
h5,
111-
h6 {
112-
font-family:
113-
'Eudoxus Sans',
114-
system-ui,
115-
'Roboto',
116-
'Segoe UI',
117-
sans-serif;
118-
}
119-
120-
a {
121-
color: #8367e7 !important;
122-
}
123-
124-
a:hover {
125-
color: #b19dff !important;
126-
}
127-
128-
.tsd-navigation a,
129-
.tsd-navigation a:visited {
130-
color: #e3e7fb !important;
131-
}
132-
133-
.tsd-navigation a:hover,
134-
.tsd-navigation a.current {
135-
color: #b19dff !important;
136-
}
137-
138-
.tsd-kind-icon {
139-
color: inherit !important;
140-
}
141-
142-
.tsd-panel {
143-
border-color: #3f3f46;
144-
}
145-
146-
.tsd-signature {
147-
border-color: #3f3f46;
148-
}
149-
150-
code {
151-
background: #27272a !important;
152-
color: #e3e7fb;
153-
padding: 0.15em 0.35em;
154-
border-radius: 0.25rem;
155-
font-size: 0.9em;
156-
}
157-
158-
pre {
159-
background: #000000 !important;
160-
border: 1px solid #3f3f46 !important;
161-
border-radius: 0.5rem !important;
162-
padding: 1.25rem !important;
163-
margin: 1.25rem 0 !important;
164-
overflow-x: auto;
165-
line-height: 1.6;
166-
}
167-
168-
pre code {
169-
background: transparent !important;
170-
color: #e3e7fb !important;
171-
padding: 0 !important;
172-
display: block;
173-
font-size: 0.875rem;
174-
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
175-
}
176-
177-
.tsd-theme-toggle,
178-
.tsd-navigation.settings {
179-
display: none !important;
180-
}
181-
}
19+
/* Code Blocks and Syntax Highlighting */
20+
@import './styles/code.css';

‎theme/favicon.ico‎

20.5 KB
Binary file not shown.

‎theme/styles/code.css‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
@layer typedoc {
2+
code {
3+
background: #27272a !important;
4+
color: #e3e7fb;
5+
padding: 0.15em 0.35em;
6+
border-radius: 0.25rem;
7+
font-size: 0.9em;
8+
}
9+
10+
pre {
11+
background: #000000 !important;
12+
border: 1px solid #3f3f46 !important;
13+
border-radius: 0.5rem !important;
14+
padding: 1.25rem !important;
15+
margin: 1.25rem 0 !important;
16+
overflow-x: auto;
17+
line-height: 1.6;
18+
}
19+
20+
pre code {
21+
background: transparent !important;
22+
color: #e3e7fb !important;
23+
padding: 0 !important;
24+
display: block;
25+
font-size: 0.875rem;
26+
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
27+
}
28+
}

‎theme/styles/header.css‎

Lines changed: 42 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎theme/styles/layout.css‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
@layer typedoc {
2+
html {
3+
background: #000000 !important;
4+
}
5+
6+
body {
7+
position: relative;
8+
overflow-x: hidden;
9+
font-family:
10+
'Inter',
11+
system-ui,
12+
'Roboto',
13+
'Segoe UI',
14+
sans-serif;
15+
background: #000000 !important;
16+
}
17+
18+
body::before {
19+
content: '';
20+
position: fixed;
21+
bottom: -20%;
22+
left: 50%;
23+
transform: translateX(-50%);
24+
width: 200%;
25+
height: 90vh;
26+
z-index: 0;
27+
background: radial-gradient(ellipse at center, rgba(131, 103, 231, 0.5) 0%, rgba(96, 66, 199, 0.35) 25%, rgba(131, 103, 231, 0.15) 45%, transparent 70%);
28+
pointer-events: none;
29+
}
30+
31+
.tsd-page-content,
32+
main,
33+
.container {
34+
position: relative;
35+
z-index: 1;
36+
}
37+
38+
.container,
39+
.container-fluid,
40+
.tsd-page-content,
41+
main {
42+
background: transparent !important;
43+
}
44+
}

‎theme/styles/links.css‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
@layer typedoc {
2+
a {
3+
color: #8367e7 !important;
4+
}
5+
6+
a:hover {
7+
color: #b19dff !important;
8+
}
9+
10+
.tsd-navigation a,
11+
.tsd-navigation a:visited {
12+
color: #e3e7fb !important;
13+
}
14+
15+
.tsd-navigation a:hover,
16+
.tsd-navigation a.current {
17+
color: #b19dff !important;
18+
}
19+
20+
.tsd-kind-icon {
21+
color: inherit !important;
22+
}
23+
}

‎theme/styles/panels.css‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
@layer typedoc {
2+
.tsd-panel {
3+
border-color: #3f3f46;
4+
}
5+
6+
.tsd-signature {
7+
border-color: #3f3f46;
8+
}
9+
10+
.tsd-theme-toggle,
11+
.tsd-navigation.settings {
12+
display: none !important;
13+
}
14+
}

‎theme/styles/typography.css‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
@layer typedoc {
2+
h1,
3+
h2,
4+
h3,
5+
h4,
6+
h5,
7+
h6 {
8+
font-family:
9+
'Eudoxus Sans',
10+
system-ui,
11+
'Roboto',
12+
'Segoe UI',
13+
sans-serif;
14+
}
15+
}

0 commit comments

Comments
 (0)