Skip to content

Commit 6db6eff

Browse files
sripwoudsripwoud
authored
style: define custom theme (#41)
1 parent 24d76ec commit 6db6eff

File tree

12 files changed

+287
-2
lines changed

12 files changed

+287
-2
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
],
2121
"scripts": {
2222
"lint": "eslint .",
23-
"typedoc": "typedoc",
23+
"typedoc": "typedoc && mkdir -p doc/assets && cp -r theme/styles doc/assets/",
2424
"test:javascriptcore": "npm run test:jsc --",
2525
"test:v8": "exodus-test --engine=v8:bundle",
2626
"test:jsc": "exodus-test --engine=jsc:bundle",

‎theme/custom.css‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/* CSS Variables and Base Settings */
2+
@import "./styles/variables.css";
3+
4+
/* Layout and Background */
5+
@import "./styles/layout.css";
6+
7+
/* Header and Navigation */
8+
@import "./styles/header.css";
9+
10+
/* Typography */
11+
@import "./styles/typography.css";
12+
13+
/* Links and Navigation */
14+
@import "./styles/links.css";
15+
16+
/* Panels and Containers */
17+
@import "./styles/panels.css";
18+
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: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
@layer typedoc {
2+
header,
3+
.tsd-page-toolbar,
4+
.tsd-header {
5+
background: #000000 !important;
6+
border-bottom: 1px solid #3f3f46;
7+
}
8+
9+
.title {
10+
display: flex !important;
11+
align-items: center !important;
12+
gap: 0 !important;
13+
}
14+
15+
.title::before {
16+
content: "";
17+
display: inline-block;
18+
width: calc(24px + 0.75rem + 1px + 0.75rem);
19+
height: 24px;
20+
background-image:
21+
url("data:image/svg+xml;utf8,<svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"%23a1a1aa\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M25.035 13.881C24.3865 13.5724 23.7037 13.4141 22.9867 13.4113C22.1706 13.4077 21.8042 13.4084 21.0338 13.4127C20.9012 13.4134 20.7202 13.494 20.6311 13.5916C19.304 15.0477 17.9805 16.5074 16.6555 17.9663C16.5871 18.0419 16.518 18.1174 16.4438 18.1987C16.3989 18.2478 16.3989 18.3241 16.4438 18.3733C16.7482 18.7054 17.0432 19.0283 17.3383 19.3504C18.448 20.5621 19.557 21.7737 20.6703 22.9825C20.7366 23.0545 20.8713 23.1136 20.9689 23.1143C21.7679 23.12 22.1136 23.1222 22.9346 23.1172C25.3565 23.1022 27.3371 21.4159 27.742 19.0276C28.0969 16.935 26.9751 14.8025 25.035 13.881ZM22.6759 21.1379C21.0872 21.1379 19.8001 19.85 19.8001 18.2621C19.8001 16.6741 21.088 15.3862 22.6759 15.3862C24.2639 15.3862 25.5518 16.6741 25.5518 18.2621C25.5518 19.85 24.2639 21.1379 22.6759 21.1379Z\"/><path d=\"M15.5081 18.3426C15.4788 18.3105 15.4788 18.2621 15.5081 18.23C16.9029 16.6934 18.2913 15.1639 19.6953 13.6172C19.7645 13.541 19.7117 13.4177 19.6084 13.4162C19.4117 13.4134 17.7446 13.4091 16.7461 13.4148C16.6798 13.4148 16.5964 13.4576 16.5508 13.5075C15.6891 14.4476 14.8317 15.3912 13.9736 16.3341C13.9572 16.3527 13.9401 16.3705 13.9158 16.3954C13.8773 16.4354 13.8096 16.4289 13.7833 16.3805C13.7733 16.3627 13.7626 16.3463 13.7498 16.332C12.903 15.3955 12.0542 14.4632 11.2096 13.5267C11.1355 13.4448 11.0628 13.407 10.9495 13.407C9.97944 13.412 9.00871 13.4098 8.03797 13.4098H8.03655C7.96385 13.4098 7.92608 13.4961 7.97525 13.5502C8.30952 13.918 8.62312 14.2644 8.93743 14.6101C10.0186 15.8003 11.0984 16.9913 12.1818 18.1787C12.2559 18.2599 12.2595 18.3091 12.1818 18.3932C10.8155 19.8785 9.45202 21.3674 8.08786 22.8556C8.04724 22.8998 8.00733 22.9447 7.96314 22.9939C7.92322 23.0388 7.95458 23.1107 8.01517 23.1107C8.02158 23.1107 8.02799 23.1107 8.03441 23.1107C9.02795 23.1107 10.0058 23.115 10.9994 23.1207C11.1112 23.1207 11.1768 23.0751 11.2452 22.9996C12.092 22.0652 12.9408 21.1322 13.789 20.1985C13.8103 20.175 13.8246 20.1451 13.8503 20.1052C14.0669 20.3418 14.2636 20.5549 14.4582 20.7687C15.146 21.5235 15.8323 22.279 16.523 23.0309C16.5615 23.073 16.6292 23.1129 16.6833 23.1136C17.7182 23.1186 18.6405 23.1172 19.6754 23.1164C19.6853 23.1164 19.7331 23.1165 19.7844 23.115C19.8258 23.1143 19.8464 23.0651 19.8186 23.0352C18.3796 21.4651 16.9413 19.9049 15.5095 18.3419L15.5081 18.3426Z\"/></svg>"),
22+
linear-gradient(
23+
to right,
24+
transparent calc(24px + 0.75rem - 0.5px),
25+
rgba(161, 161, 170, 0.3) calc(24px + 0.75rem - 0.5px),
26+
rgba(161, 161, 170, 0.3) calc(24px + 0.75rem + 0.5px),
27+
transparent calc(24px + 0.75rem + 0.5px)
28+
);
29+
background-size: 24px 24px, 100% 20px;
30+
background-position: left center, left center;
31+
background-repeat: no-repeat;
32+
margin-right: 0.75rem;
33+
flex-shrink: 0;
34+
}
35+
36+
.title span {
37+
color: #e3e7fb !important;
38+
font-size: 1rem !important;
39+
font-weight: 500 !important;
40+
line-height: 24px !important;
41+
}
42+
43+
.title span {
44+
color: #e3e7fb !important;
45+
font-size: 1rem !important;
46+
font-weight: 500 !important;
47+
}
48+
}

‎theme/styles/layout.css‎

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

‎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: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@layer typedoc {
2+
h1,
3+
h2,
4+
h3,
5+
h4,
6+
h5,
7+
h6 {
8+
font-family: "Eudoxus Sans", system-ui, "Roboto", "Segoe UI", sans-serif;
9+
}
10+
}

‎theme/styles/variables.css‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
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+
}
52+
}

0 commit comments

Comments
 (0)