Skip to content

Commit 8eeed92

Browse files
author
Christian Wick
committed
Callbacks edit
1 parent 87d8690 commit 8eeed92

6 files changed

Lines changed: 310 additions & 90 deletions

File tree

docs/.vuepress/config.js

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -130,20 +130,29 @@ module.exports = {
130130
[
131131
'vuepress-plugin-right-anchor',
132132
{
133-
showDepth: 1,
133+
showDepth: -1,
134134
ignore: [
135135
'/',
136-
'/api/'
136+
// '/api/'
137137
// more...
138138
],
139139
expand: {
140140
default: true,
141-
trigger: 'hover'
141+
trigger: 'hover',
142142
},
143-
customClass: 'your-customClass',
143+
// customClass: 'your-customClass',
144144
disableGlobalUI: false,
145-
}
146-
]
145+
},
146+
],
147+
[
148+
'@silvanite/markdown-classes',
149+
{
150+
prefix: 'md',
151+
rules: [
152+
'api_reference_FiraCode',
153+
],
154+
},
155+
],
147156
],
148157
};
149158

docs/.vuepress/public/admin/preview.css

Lines changed: 83 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,29 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
2+
3+
14
html,
25
body {
36
padding: 0;
47
margin: 0;
58
background-color: #fff;
69
}
710
body {
8-
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
11+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
12+
Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
913
-webkit-font-smoothing: antialiased;
1014
-moz-osx-font-smoothing: grayscale;
1115
font-size: 16px;
1216
color: #2c3e50;
1317
}
1418
a {
1519
font-weight: 500;
16-
color: #3eaf7c;
20+
color: #ff4731;
1721
text-decoration: none;
1822
}
19-
p a code {
23+
p a code,
24+
a code {
2025
font-weight: 400;
21-
color: #3eaf7c;
26+
color: #ff4731;
2227
}
2328
kbd {
2429
background: #eee;
@@ -86,7 +91,8 @@ a.header-anchor:hover {
8691
code,
8792
kbd,
8893
.line-number {
89-
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
94+
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
95+
monospace;
9096
}
9197
p,
9298
ul,
@@ -131,7 +137,7 @@ td {
131137
border-color: #42b983;
132138
}
133139
.custom-block.warning {
134-
background-color: rgba(255,229,100,0.3);
140+
background-color: rgba(255, 229, 100, 0.3);
135141
border-color: #e7c000;
136142
color: #6b5900;
137143
}
@@ -157,7 +163,7 @@ code {
157163
padding: 0.25rem 0.5rem;
158164
margin: 0;
159165
font-size: 0.85em;
160-
background-color: rgba(27,31,35,0.05);
166+
background-color: rgba(27, 31, 35, 0.05);
161167
border-radius: 3px;
162168
}
163169
code .token.deleted {
@@ -167,7 +173,7 @@ code .token.inserted {
167173
color: #3eaf7c;
168174
}
169175
pre,
170-
pre[class*="language-"] {
176+
pre[class*='language-'] {
171177
line-height: 1.4;
172178
padding: 1.25rem 1.5rem;
173179
margin: 0.85rem 0;
@@ -176,18 +182,18 @@ pre[class*="language-"] {
176182
overflow: auto;
177183
}
178184
pre code,
179-
pre[class*="language-"] code {
185+
pre[class*='language-'] code {
180186
color: #fff;
181187
padding: 0;
182188
background-color: transparent;
183189
border-radius: 0;
184190
}
185-
div[class*="language-"] {
191+
div[class*='language-'] {
186192
position: relative;
187193
background-color: #282c34;
188194
border-radius: 6px;
189195
}
190-
div[class*="language-"] .highlight-lines {
196+
div[class*='language-'] .highlight-lines {
191197
user-select: none;
192198
padding-top: 1.3rem;
193199
position: absolute;
@@ -196,30 +202,30 @@ div[class*="language-"] .highlight-lines {
196202
width: 100%;
197203
line-height: 1.4;
198204
}
199-
div[class*="language-"] .highlight-lines .highlighted {
200-
background-color: rgba(0,0,0,0.66);
205+
div[class*='language-'] .highlight-lines .highlighted {
206+
background-color: rgba(0, 0, 0, 0.66);
201207
}
202-
div[class*="language-"] pre,
203-
div[class*="language-"] pre[class*="language-"] {
208+
div[class*='language-'] pre,
209+
div[class*='language-'] pre[class*='language-'] {
204210
background: transparent;
205211
position: relative;
206212
z-index: 1;
207213
}
208-
div[class*="language-"]::before {
214+
div[class*='language-']::before {
209215
position: absolute;
210216
z-index: 3;
211217
top: 0.8em;
212218
right: 1em;
213219
font-size: 0.75rem;
214-
color: rgba(255,255,255,0.4);
220+
color: rgba(255, 255, 255, 0.4);
215221
}
216-
div[class*="language-"]:not(.line-numbers-mode) .line-numbers-wrapper {
222+
div[class*='language-']:not(.line-numbers-mode) .line-numbers-wrapper {
217223
display: none;
218224
}
219-
div[class*="language-"].line-numbers-mode .highlight-lines .highlighted {
225+
div[class*='language-'].line-numbers-mode .highlight-lines .highlighted {
220226
position: relative;
221227
}
222-
div[class*="language-"].line-numbers-mode .highlight-lines .highlighted:before {
228+
div[class*='language-'].line-numbers-mode .highlight-lines .highlighted:before {
223229
content: ' ';
224230
position: absolute;
225231
z-index: 3;
@@ -228,31 +234,31 @@ div[class*="language-"].line-numbers-mode .highlight-lines .highlighted:before {
228234
display: block;
229235
width: 3.5rem;
230236
height: 100%;
231-
background-color: rgba(0,0,0,0.66);
237+
background-color: rgba(0, 0, 0, 0.66);
232238
}
233-
div[class*="language-"].line-numbers-mode pre {
239+
div[class*='language-'].line-numbers-mode pre {
234240
padding-left: 4.5rem;
235241
vertical-align: middle;
236242
}
237-
div[class*="language-"].line-numbers-mode .line-numbers-wrapper {
243+
div[class*='language-'].line-numbers-mode .line-numbers-wrapper {
238244
position: absolute;
239245
top: 0;
240246
width: 3.5rem;
241247
text-align: center;
242-
color: rgba(255,255,255,0.3);
248+
color: rgba(255, 255, 255, 0.3);
243249
padding: 1.25rem 0;
244250
line-height: 1.4;
245251
}
246-
div[class*="language-"].line-numbers-mode .line-numbers-wrapper br {
252+
div[class*='language-'].line-numbers-mode .line-numbers-wrapper br {
247253
user-select: none;
248254
}
249-
div[class*="language-"].line-numbers-mode .line-numbers-wrapper .line-number {
255+
div[class*='language-'].line-numbers-mode .line-numbers-wrapper .line-number {
250256
position: relative;
251257
z-index: 4;
252258
user-select: none;
253259
font-size: 0.85em;
254260
}
255-
div[class*="language-"].line-numbers-mode::after {
261+
div[class*='language-'].line-numbers-mode::after {
256262
content: '';
257263
position: absolute;
258264
z-index: 2;
@@ -261,92 +267,92 @@ div[class*="language-"].line-numbers-mode::after {
261267
width: 3.5rem;
262268
height: 100%;
263269
border-radius: 6px 0 0 6px;
264-
border-right: 1px solid rgba(0,0,0,0.66);
270+
border-right: 1px solid rgba(0, 0, 0, 0.66);
265271
background-color: #282c34;
266272
}
267-
div[class~="language-js"]:before {
273+
div[class~='language-js']:before {
268274
content: 'js';
269275
}
270-
div[class~="language-ts"]:before {
276+
div[class~='language-ts']:before {
271277
content: 'ts';
272278
}
273-
div[class~="language-html"]:before {
279+
div[class~='language-html']:before {
274280
content: 'html';
275281
}
276-
div[class~="language-md"]:before {
282+
div[class~='language-md']:before {
277283
content: 'md';
278284
}
279-
div[class~="language-vue"]:before {
285+
div[class~='language-vue']:before {
280286
content: 'vue';
281287
}
282-
div[class~="language-css"]:before {
288+
div[class~='language-css']:before {
283289
content: 'css';
284290
}
285-
div[class~="language-sass"]:before {
291+
div[class~='language-sass']:before {
286292
content: 'sass';
287293
}
288-
div[class~="language-scss"]:before {
294+
div[class~='language-scss']:before {
289295
content: 'scss';
290296
}
291-
div[class~="language-less"]:before {
297+
div[class~='language-less']:before {
292298
content: 'less';
293299
}
294-
div[class~="language-stylus"]:before {
300+
div[class~='language-stylus']:before {
295301
content: 'stylus';
296302
}
297-
div[class~="language-go"]:before {
303+
div[class~='language-go']:before {
298304
content: 'go';
299305
}
300-
div[class~="language-java"]:before {
306+
div[class~='language-java']:before {
301307
content: 'java';
302308
}
303-
div[class~="language-c"]:before {
309+
div[class~='language-c']:before {
304310
content: 'c';
305311
}
306-
div[class~="language-sh"]:before {
312+
div[class~='language-sh']:before {
307313
content: 'sh';
308314
}
309-
div[class~="language-yaml"]:before {
315+
div[class~='language-yaml']:before {
310316
content: 'yaml';
311317
}
312-
div[class~="language-py"]:before {
318+
div[class~='language-py']:before {
313319
content: 'py';
314320
}
315-
div[class~="language-docker"]:before {
321+
div[class~='language-docker']:before {
316322
content: 'docker';
317323
}
318-
div[class~="language-dockerfile"]:before {
324+
div[class~='language-dockerfile']:before {
319325
content: 'dockerfile';
320326
}
321-
div[class~="language-makefile"]:before {
327+
div[class~='language-makefile']:before {
322328
content: 'makefile';
323329
}
324-
div[class~="language-javascript"]:before {
325-
content: "js";
330+
div[class~='language-javascript']:before {
331+
content: 'js';
326332
}
327-
div[class~="language-typescript"]:before {
328-
content: "ts";
333+
div[class~='language-typescript']:before {
334+
content: 'ts';
329335
}
330-
div[class~="language-markup"]:before {
331-
content: "html";
336+
div[class~='language-markup']:before {
337+
content: 'html';
332338
}
333-
div[class~="language-markdown"]:before {
334-
content: "md";
339+
div[class~='language-markdown']:before {
340+
content: 'md';
335341
}
336-
div[class~="language-json"]:before {
337-
content: "json";
342+
div[class~='language-json']:before {
343+
content: 'json';
338344
}
339-
div[class~="language-ruby"]:before {
340-
content: "rb";
345+
div[class~='language-ruby']:before {
346+
content: 'rb';
341347
}
342-
div[class~="language-python"]:before {
343-
content: "py";
348+
div[class~='language-python']:before {
349+
content: 'py';
344350
}
345-
div[class~="language-bash"]:before {
346-
content: "sh";
351+
div[class~='language-bash']:before {
352+
content: 'sh';
347353
}
348-
div[class~="language-php"]:before {
349-
content: "php";
354+
div[class~='language-php']:before {
355+
content: 'php';
350356
}
351357
.frame-content {
352358
max-width: 740px;
@@ -364,7 +370,6 @@ div[class~="language-php"]:before {
364370
}
365371
}
366372

367-
368373
/* Style frontmatter in preview */
369374
.frame-content > div > div:not(:last-child) * {
370375
font-size: 0.8rem;
@@ -379,9 +384,19 @@ div[class~="language-php"]:before {
379384

380385
.frame-content::before {
381386
display: block;
382-
content: "FRONTMATTER";
387+
content: 'FRONTMATTER';
383388
font-size: 0.6rem;
384389
font-weight: bold;
385390
color: #3eaf7c;
386391
border-bottom: 1px solid #42b983;
387-
}
392+
}
393+
394+
.md-api_reference_FiraCode {
395+
font-family: 'Fira Code', monospace;
396+
}
397+
.md-api_reference_FiraCode h4 {
398+
margin-block-start: 3.33em;
399+
}
400+
.md-api_reference_FiraCode p:last-child {
401+
margin-bottom: 3.3em;
402+
}

0 commit comments

Comments
 (0)