Skip to content

Commit 95782ac

Browse files
jbromajbroma
authored
docs: use doc style from repack (#53)
1 parent 7fa637e commit 95782ac

File tree

2 files changed

+213
-0
lines changed

2 files changed

+213
-0
lines changed

‎docs/docs/styles/index.css‎

Lines changed: 212 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
:root {
2+
--rp-sidebar-width: 320px !important;
3+
--rp-aside-width: 268px !important;
4+
}
5+
6+
:root {
7+
--rp-c-bg: #ffffff !important;
8+
--rp-c-bg-soft: #f6f6f7 !important;
9+
--rp-c-bg-mute: #ececec !important;
10+
11+
--rp-c-divider: rgba(60, 60, 60, 0.29) !important;
12+
--rp-c-divider-light: rgba(60, 60, 60, 0.12) !important;
13+
14+
--rp-c-text-1: rgb(50, 50, 50) !important;
15+
--rp-c-text-2: rgba(50, 50, 50, 0.8) !important;
16+
--rp-c-text-3: rgba(50, 50, 50, 0.6) !important;
17+
--rp-c-text-4: rgba(50, 50, 50, 0.4) !important;
18+
19+
--rp-c-text-code: var(--rp-c-brand-dark) !important;
20+
21+
--rp-c-brand: #9b6dff !important;
22+
--rp-c-brand-light: #b89dff !important;
23+
--rp-c-brand-lighter: #d4c8ff !important;
24+
--rp-c-brand-dark: #7f58cc !important;
25+
--rp-c-brand-darker: #604399 !important;
26+
--rp-c-brand-tint: rgba(155, 109, 255, 0.1) !important;
27+
28+
--rp-c-gray: #8e8e8e !important;
29+
--rp-c-gray-light-1: #aeaeae !important;
30+
--rp-c-gray-light-2: #c7c7c7 !important;
31+
--rp-c-gray-light-3: #d1d1d1 !important;
32+
--rp-c-gray-light-4: #e5e5e5 !important;
33+
--rp-c-gray-light-5: #f2f2f2 !important;
34+
35+
--rp-c-dark: #000000 !important;
36+
--rp-c-dark-light-1: #2f2f2f !important;
37+
--rp-c-dark-light-2: #3a3a3a !important;
38+
--rp-c-dark-light-3: #4a4a4a !important;
39+
--rp-c-dark-light-4: #5c5c5c !important;
40+
--rp-c-dark-light-5: #6b6b6b !important;
41+
42+
--rp-radius: 1rem !important;
43+
--rp-radius-small: 0.5rem !important;
44+
--rp-radius-large: 1.5rem !important;
45+
}
46+
47+
.dark {
48+
--rp-c-bg: #161618 !important;
49+
--rp-c-bg-soft: #1b1b1f !important;
50+
--rp-c-bg-mute: #65758529 !important;
51+
52+
--rp-c-divider-light: #65758529 !important;
53+
54+
--rp-c-text-1: #dde1e6 !important;
55+
--rp-c-text-2: #b2b8bf !important;
56+
--rp-c-text-3: #878c92 !important;
57+
--rp-c-text-4: #5c6166 !important;
58+
59+
/* Will be used in overview page */
60+
--rp-c-text-code: var(--rp-c-brand-light) !important;
61+
}
62+
63+
/* Code blocks */
64+
:root {
65+
--rp-code-block-bg: var(--rp-c-bg-soft);
66+
--rp-code-title-bg: var(--rp-c-bg-mute);
67+
}
68+
69+
.dark {
70+
--rp-code-block-bg: var(--rp-c-bg-soft);
71+
--rp-code-title-bg: var(--rp-c-bg-mute);
72+
}
73+
74+
/* MD Containers */
75+
:root {
76+
--rp-container-info-border: rgba(155, 109, 255, 0.2) !important;
77+
--rp-container-info-text: #9b6dff !important;
78+
--rp-container-info-bg: rgba(155, 109, 255, 0.06) !important;
79+
--rp-container-info-code-bg: rgba(155, 109, 255, 0.1) !important;
80+
}
81+
82+
.dark {
83+
--rp-container-info-text: #9b6dff !important;
84+
}
85+
86+
/* Home background gradient */
87+
:root {
88+
--rp-home-mask-background-image: conic-gradient(
89+
from 180deg at 50% 50%,
90+
var(--rp-c-brand) 0deg,
91+
180deg,
92+
var(--rp-c-brand-darker) 1turn
93+
);
94+
}
95+
96+
/* Nav header */
97+
.rspress-nav {
98+
background-color: var(--rp-c-bg-soft) !important;
99+
border-bottom: 1px solid var(--rp-c-divider-light) !important;
100+
}
101+
102+
/* Sidebar item vertical line */
103+
.rspress-sidebar-group::before {
104+
content: none;
105+
}
106+
107+
/* Sidebar section items */
108+
.rspress-sidebar-group > div > a > div {
109+
background-color: transparent !important;
110+
font-size: 14px !important;
111+
padding-top: 0.3rem;
112+
padding-bottom: 0.3rem;
113+
114+
&:hover {
115+
color: var(--rp-c-brand) !important;
116+
}
117+
118+
&::before {
119+
content: none;
120+
}
121+
}
122+
123+
/* Deeply nested section items */
124+
.rspress-sidebar-group > div > section > div {
125+
background-color: transparent !important;
126+
127+
& > h2 {
128+
font-size: 14px !important;
129+
}
130+
131+
&:hover {
132+
color: var(--rp-c-brand) !important;
133+
}
134+
}
135+
136+
.rspress-sidebar {
137+
border-right: 1px solid var(--rp-c-divider-light) !important;
138+
margin-right: 12px !important;
139+
140+
& > div {
141+
padding-right: 0 !important;
142+
}
143+
}
144+
145+
/* Sidebar section headers */
146+
.rspress-scrollbar > nav > section > div:first-child {
147+
background-color: transparent !important;
148+
149+
&:hover {
150+
color: var(--rp-c-brand) !important;
151+
}
152+
}
153+
154+
.rspress-scrollbar > nav > a > div:first-child {
155+
background-color: transparent !important;
156+
157+
&::before {
158+
content: none;
159+
}
160+
161+
&:hover {
162+
color: var(--rp-c-brand) !important;
163+
}
164+
}
165+
166+
/* Sidebar section headers */
167+
.rspress-sidebar-section-header > span {
168+
font-size: 15px !important;
169+
font-weight: 700;
170+
}
171+
172+
/* Table of Contents */
173+
#aside-container {
174+
border-left: 1px solid var(--rp-c-divider-light) !important;
175+
padding-left: 1rem;
176+
}
177+
178+
.home-hero-name-img {
179+
width: 100%;
180+
margin-top: 1.5rem;
181+
margin-bottom: 1.5rem;
182+
}
183+
184+
div:has(> p.rspress-home-hero-text) {
185+
align-items: stretch;
186+
}
187+
188+
a:has(> span.home-hero-primary-action) {
189+
background: var(--rp-c-brand) !important;
190+
}
191+
192+
p.rspress-home-hero-text {
193+
font-size: 1.35rem;
194+
}
195+
196+
@media (min-width: 370px) {
197+
p.rspress-home-hero-text {
198+
font-size: 1.5rem;
199+
}
200+
}
201+
202+
@media (min-width: 640px) {
203+
p.rspress-home-hero-text {
204+
font-size: 2rem;
205+
}
206+
}
207+
208+
@media (min-width: 768px) {
209+
p.rspress-home-hero-text {
210+
font-size: 3rem;
211+
}
212+
}

‎docs/rspress.config.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ export default defineConfig({
1919
},
2020
],
2121
},
22+
globalStyles: path.join(__dirname, 'docs/styles/index.css'),
2223
builderConfig: {
2324
plugins: [
2425
pluginOpenGraph({

0 commit comments

Comments
 (0)