the home site for me: also iteration 3 or 4 of my site
feat: use catppuccin inspired code theme
+571
-1
+3
-1
config.toml
+3
-1
config.toml
···
16
16
render_emoji = true
17
17
external_links_target_blank = true
18
18
smart_punctuation = true
19
+
19
20
highlight_code = true
20
-
highlight_theme = "Catppuccin-macchiato"
21
+
highlight_theme = "css"
22
+
21
23
extra_syntaxes_and_themes = ["highlighting", "highlighting/catppuccin"]
22
24
23
25
[slugify]
+563
static/css/syntax-theme.css
+563
static/css/syntax-theme.css
···
1
+
/*
2
+
* theme "Catppuccin" generated by syntect
3
+
*/
4
+
5
+
html[data-theme="light"] .z-code {
6
+
color: #4c4f69;
7
+
background-color: #f3f2f2;
8
+
}
9
+
10
+
html[data-theme="light"] .z-comment {
11
+
color: #9ca0b0;
12
+
font-style: italic;
13
+
}
14
+
html[data-theme="light"] .z-string {
15
+
color: #40a02b;
16
+
}
17
+
html[data-theme="light"] .z-string.z-regexp {
18
+
color: #fe640b;
19
+
}
20
+
html[data-theme="light"] .z-constant.z-numeric {
21
+
color: #fe640b;
22
+
}
23
+
html[data-theme="light"] .z-constant.z-language.z-boolean {
24
+
color: #fe640b;
25
+
font-weight: bold;
26
+
font-style: italic;
27
+
}
28
+
html[data-theme="light"] .z-constant.z-language {
29
+
color: #7287fd;
30
+
font-style: italic;
31
+
}
32
+
html[data-theme="light"] .z-support.z-function.z-builtin {
33
+
color: #fe640b;
34
+
font-style: italic;
35
+
}
36
+
html[data-theme="light"] .z-variable.z-other.z-constant {
37
+
color: #fe640b;
38
+
}
39
+
html[data-theme="light"] .z-keyword {
40
+
color: #d20f39;
41
+
font-style: italic;
42
+
}
43
+
html[data-theme="light"] .z-keyword.z-control.z-loop,
44
+
.z-keyword.z-control.z-conditional,
45
+
.z-keyword.z-control.z-c\+\+ {
46
+
color: #8839ef;
47
+
font-weight: bold;
48
+
}
49
+
html[data-theme="light"] .z-keyword.z-control.z-return,
50
+
.z-keyword.z-control.z-flow.z-return {
51
+
color: #ea76cb;
52
+
font-weight: bold;
53
+
}
54
+
html[data-theme="light"] .z-support.z-type.z-exception {
55
+
color: #fe640b;
56
+
font-style: italic;
57
+
}
58
+
html[data-theme="light"] .z-keyword.z-operator,
59
+
.z-punctuation.z-accessor {
60
+
color: #04a5e5;
61
+
font-weight: bold;
62
+
}
63
+
html[data-theme="light"] .z-punctuation.z-separator {
64
+
color: #179299;
65
+
}
66
+
html[data-theme="light"] .z-punctuation.z-terminator {
67
+
color: #179299;
68
+
}
69
+
html[data-theme="light"] .z-punctuation.z-section {
70
+
color: #7c7f93;
71
+
}
72
+
html[data-theme="light"] .z-keyword.z-control.z-import.z-include {
73
+
color: #179299;
74
+
font-style: italic;
75
+
}
76
+
html[data-theme="light"] .z-storage {
77
+
color: #d20f39;
78
+
}
79
+
html[data-theme="light"] .z-storage.z-type {
80
+
color: #df8e1d;
81
+
font-style: italic;
82
+
}
83
+
html[data-theme="light"] .z-storage.z-modifier {
84
+
color: #d20f39;
85
+
}
86
+
html[data-theme="light"] .z-entity.z-name.z-namespace,
87
+
.z-meta.z-path {
88
+
color: #dc8a78;
89
+
font-style: italic;
90
+
}
91
+
html[data-theme="light"] .z-storage.z-type.z-class {
92
+
color: #dc8a78;
93
+
font-style: italic;
94
+
}
95
+
html[data-theme="light"] .z-entity.z-name.z-label {
96
+
color: #1e66f5;
97
+
}
98
+
html[data-theme="light"] .z-keyword.z-declaration.z-class {
99
+
color: #d20f39;
100
+
font-style: italic;
101
+
}
102
+
html[data-theme="light"] .z-entity.z-name.z-class,
103
+
.z-meta.z-toc-list.z-full-identifier {
104
+
color: #04a5e5;
105
+
}
106
+
html[data-theme="light"] .z-entity.z-other.z-inherited-class {
107
+
color: #04a5e5;
108
+
font-style: italic;
109
+
}
110
+
html[data-theme="light"] .z-entity.z-name.z-function,
111
+
.z-variable.z-function {
112
+
color: #1e66f5;
113
+
font-style: italic;
114
+
}
115
+
html[data-theme="light"] .z-entity.z-name.z-function.z-preprocessor {
116
+
color: #d20f39;
117
+
}
118
+
html[data-theme="light"] .z-keyword.z-control.z-import {
119
+
color: #d20f39;
120
+
}
121
+
html[data-theme="light"] .z-entity.z-name.z-function.z-constructor,
122
+
.z-entity.z-name.z-function.z-destructor {
123
+
color: #7287fd;
124
+
}
125
+
html[data-theme="light"] .z-variable.z-parameter.z-function {
126
+
color: #dc8a78;
127
+
font-style: italic;
128
+
}
129
+
html[data-theme="light"] .z-keyword.z-declaration.z-function {
130
+
color: #e64553;
131
+
font-style: italic;
132
+
}
133
+
html[data-theme="light"] .z-support.z-function {
134
+
color: #04a5e5;
135
+
}
136
+
html[data-theme="light"] .z-support.z-constant {
137
+
color: #1e66f5;
138
+
}
139
+
html[data-theme="light"] .z-support.z-type,
140
+
.z-support.z-class {
141
+
color: #1e66f5;
142
+
font-style: italic;
143
+
}
144
+
html[data-theme="light"] .z-variable.z-function {
145
+
color: #1e66f5;
146
+
font-style: italic;
147
+
}
148
+
html[data-theme="light"] .z-variable.z-parameter {
149
+
color: #dc8a78;
150
+
font-style: italic;
151
+
}
152
+
html[data-theme="light"] .z-variable.z-other {
153
+
color: #4c4f69;
154
+
font-style: italic;
155
+
}
156
+
html[data-theme="light"] .z-variable.z-other.z-member {
157
+
color: #dc8a78;
158
+
}
159
+
html[data-theme="light"] .z-variable.z-language {
160
+
color: #179299;
161
+
}
162
+
html[data-theme="light"] .z-entity.z-name.z-tag {
163
+
color: #fe640b;
164
+
}
165
+
html[data-theme="light"] .z-entity.z-other.z-attribute-name {
166
+
color: #8839ef;
167
+
font-style: italic;
168
+
}
169
+
html[data-theme="light"] .z-punctuation.z-definition.z-tag {
170
+
color: #e64553;
171
+
}
172
+
html[data-theme="light"] .z-markup.z-underline.z-link.z-markdown {
173
+
color: #dc8a78;
174
+
text-decoration: underline;
175
+
font-style: italic;
176
+
}
177
+
html[data-theme="light"] .z-meta.z-link.z-inline.z-description {
178
+
color: #7287fd;
179
+
font-weight: bold;
180
+
}
181
+
html[data-theme="light"] .z-comment.z-block.z-markdown,
182
+
.z-meta.z-code-fence,
183
+
.z-markup.z-raw.z-code-fence,
184
+
.z-markup.z-raw.z-inline {
185
+
color: #179299;
186
+
font-style: italic;
187
+
}
188
+
html[data-theme="light"] .z-punctuation.z-definition.z-heading,
189
+
.z-entity.z-name.z-section {
190
+
color: #1e66f5;
191
+
font-weight: bold;
192
+
}
193
+
html[data-theme="light"] .z-markup.z-italic {
194
+
color: #e64553;
195
+
font-style: italic;
196
+
}
197
+
html[data-theme="light"] .z-markup.z-bold {
198
+
color: #e64553;
199
+
font-weight: bold;
200
+
}
201
+
html[data-theme="light"] .z-constant.z-character.z-escape {
202
+
color: #ea76cb;
203
+
}
204
+
html[data-theme="light"]
205
+
.z-source.z-shell.z-bash
206
+
.z-meta.z-function.z-shell
207
+
.z-meta.z-compound.z-shell
208
+
.z-meta.z-function-call.z-identifier.z-shell {
209
+
color: #ea76cb;
210
+
}
211
+
html[data-theme="light"] .z-variable.z-language.z-shell {
212
+
color: #d20f39;
213
+
font-style: italic;
214
+
}
215
+
html[data-theme="light"]
216
+
.z-source.z-lua
217
+
.z-meta.z-function.z-lua
218
+
.z-meta.z-block.z-lua
219
+
.z-meta.z-mapping.z-value.z-lua
220
+
.z-meta.z-mapping.z-key.z-lua
221
+
.z-string.z-unquoted.z-key.z-lua {
222
+
color: #7287fd;
223
+
font-style: italic;
224
+
}
225
+
html[data-theme="light"]
226
+
.z-source.z-lua
227
+
.z-meta.z-function.z-lua
228
+
.z-meta.z-block.z-lua
229
+
.z-meta.z-mapping.z-key.z-lua
230
+
.z-string.z-unquoted.z-key.z-lua {
231
+
color: #dd7878;
232
+
}
233
+
html[data-theme="light"] .z-entity.z-name.z-constant.z-java {
234
+
color: #179299;
235
+
}
236
+
html[data-theme="light"] .z-support.z-type.z-property-name.z-css {
237
+
color: #dd7878;
238
+
font-style: italic;
239
+
}
240
+
html[data-theme="light"] .z-support.z-constant.z-property-value.z-css {
241
+
color: #4c4f69;
242
+
}
243
+
html[data-theme="light"] .z-constant.z-numeric.z-suffix.z-css,
244
+
.z-keyword.z-other.z-unit.z-css {
245
+
color: #179299;
246
+
font-style: italic;
247
+
}
248
+
html[data-theme="light"] .z-variable.z-other.z-custom-property.z-name.z-css,
249
+
.z-support.z-type.z-custom-property.z-name.z-css,
250
+
.z-punctuation.z-definition.z-custom-property.z-css {
251
+
color: #179299;
252
+
}
253
+
html[data-theme="light"] .z-entity.z-name.z-tag.z-css {
254
+
color: #7287fd;
255
+
}
256
+
html[data-theme="light"] .z-variable.z-other.z-sass {
257
+
color: #179299;
258
+
}
259
+
html[data-theme="light"] .z-invalid {
260
+
color: #4c4f69;
261
+
background-color: #d20f39;
262
+
}
263
+
html[data-theme="light"] .z-invalid.z-deprecated {
264
+
color: #4c4f69;
265
+
background-color: #8839ef;
266
+
}
267
+
html[data-theme="light"] .z-meta.z-diff,
268
+
.z-meta.z-diff.z-header {
269
+
color: #9ca0b0;
270
+
}
271
+
html[data-theme="light"] .z-markup.z-deleted {
272
+
color: #d20f39;
273
+
}
274
+
html[data-theme="light"] .z-markup.z-inserted {
275
+
color: #40a02b;
276
+
}
277
+
html[data-theme="light"] .z-markup.z-changed {
278
+
color: #df8e1d;
279
+
}
280
+
html[data-theme="light"] .z-message.z-error {
281
+
color: #d20f39;
282
+
}
283
+
284
+
/* dark */
285
+
286
+
html[data-theme="dark"] .z-code {
287
+
color: #cad3f5;
288
+
background-color: #2a2e35;
289
+
}
290
+
291
+
html[data-theme="dark"] .z-comment {
292
+
color: #6e738d;
293
+
font-style: italic;
294
+
}
295
+
html[data-theme="dark"] .z-string {
296
+
color: #a6da95;
297
+
}
298
+
html[data-theme="dark"] .z-string.z-regexp {
299
+
color: #f5a97f;
300
+
}
301
+
html[data-theme="dark"] .z-constant.z-numeric {
302
+
color: #f5a97f;
303
+
}
304
+
html[data-theme="dark"] .z-constant.z-language.z-boolean {
305
+
color: #f5a97f;
306
+
font-weight: bold;
307
+
font-style: italic;
308
+
}
309
+
html[data-theme="dark"] .z-constant.z-language {
310
+
color: #b7bdf8;
311
+
font-style: italic;
312
+
}
313
+
html[data-theme="dark"] .z-support.z-function.z-builtin {
314
+
color: #f5a97f;
315
+
font-style: italic;
316
+
}
317
+
html[data-theme="dark"] .z-variable.z-other.z-constant {
318
+
color: #f5a97f;
319
+
}
320
+
html[data-theme="dark"] .z-keyword {
321
+
color: #ed8796;
322
+
font-style: italic;
323
+
}
324
+
html[data-theme="dark"] .z-keyword.z-control.z-loop,
325
+
.z-keyword.z-control.z-conditional,
326
+
.z-keyword.z-control.z-c\+\+ {
327
+
color: #c6a0f6;
328
+
font-weight: bold;
329
+
}
330
+
html[data-theme="dark"] .z-keyword.z-control.z-return,
331
+
.z-keyword.z-control.z-flow.z-return {
332
+
color: #f5bde6;
333
+
font-weight: bold;
334
+
}
335
+
html[data-theme="dark"] .z-support.z-type.z-exception {
336
+
color: #f5a97f;
337
+
font-style: italic;
338
+
}
339
+
html[data-theme="dark"] .z-keyword.z-operator,
340
+
.z-punctuation.z-accessor {
341
+
color: #91d7e3;
342
+
font-weight: bold;
343
+
}
344
+
html[data-theme="dark"] .z-punctuation.z-separator {
345
+
color: #8bd5ca;
346
+
}
347
+
html[data-theme="dark"] .z-punctuation.z-terminator {
348
+
color: #8bd5ca;
349
+
}
350
+
html[data-theme="dark"] .z-punctuation.z-section {
351
+
color: #939ab7;
352
+
}
353
+
html[data-theme="dark"] .z-keyword.z-control.z-import.z-include {
354
+
color: #8bd5ca;
355
+
font-style: italic;
356
+
}
357
+
html[data-theme="dark"] .z-storage {
358
+
color: #ed8796;
359
+
}
360
+
html[data-theme="dark"] .z-storage.z-type {
361
+
color: #eed49f;
362
+
font-style: italic;
363
+
}
364
+
html[data-theme="dark"] .z-storage.z-modifier {
365
+
color: #ed8796;
366
+
}
367
+
html[data-theme="dark"] .z-entity.z-name.z-namespace,
368
+
.z-meta.z-path {
369
+
color: #f4dbd6;
370
+
font-style: italic;
371
+
}
372
+
html[data-theme="dark"] .z-storage.z-type.z-class {
373
+
color: #f4dbd6;
374
+
font-style: italic;
375
+
}
376
+
html[data-theme="dark"] .z-entity.z-name.z-label {
377
+
color: #8aadf4;
378
+
}
379
+
html[data-theme="dark"] .z-keyword.z-declaration.z-class {
380
+
color: #ed8796;
381
+
font-style: italic;
382
+
}
383
+
html[data-theme="dark"] .z-entity.z-name.z-class,
384
+
.z-meta.z-toc-list.z-full-identifier {
385
+
color: #91d7e3;
386
+
}
387
+
html[data-theme="dark"] .z-entity.z-other.z-inherited-class {
388
+
color: #91d7e3;
389
+
font-style: italic;
390
+
}
391
+
html[data-theme="dark"] .z-entity.z-name.z-function,
392
+
.z-variable.z-function {
393
+
color: #8aadf4;
394
+
font-style: italic;
395
+
}
396
+
html[data-theme="dark"] .z-entity.z-name.z-function.z-preprocessor {
397
+
color: #ed8796;
398
+
}
399
+
html[data-theme="dark"] .z-keyword.z-control.z-import {
400
+
color: #ed8796;
401
+
}
402
+
html[data-theme="dark"] .z-entity.z-name.z-function.z-constructor,
403
+
.z-entity.z-name.z-function.z-destructor {
404
+
color: #b7bdf8;
405
+
}
406
+
html[data-theme="dark"] .z-variable.z-parameter.z-function {
407
+
color: #f4dbd6;
408
+
font-style: italic;
409
+
}
410
+
html[data-theme="dark"] .z-keyword.z-declaration.z-function {
411
+
color: #ee99a0;
412
+
font-style: italic;
413
+
}
414
+
html[data-theme="dark"] .z-support.z-function {
415
+
color: #91d7e3;
416
+
}
417
+
html[data-theme="dark"] .z-support.z-constant {
418
+
color: #8aadf4;
419
+
}
420
+
html[data-theme="dark"] .z-support.z-type,
421
+
.z-support.z-class {
422
+
color: #8aadf4;
423
+
font-style: italic;
424
+
}
425
+
html[data-theme="dark"] .z-variable.z-function {
426
+
color: #8aadf4;
427
+
font-style: italic;
428
+
}
429
+
html[data-theme="dark"] .z-variable.z-parameter {
430
+
color: #f4dbd6;
431
+
font-style: italic;
432
+
}
433
+
html[data-theme="dark"] .z-variable.z-other {
434
+
color: #cad3f5;
435
+
font-style: italic;
436
+
}
437
+
html[data-theme="dark"] .z-variable.z-other.z-member {
438
+
color: #f4dbd6;
439
+
}
440
+
html[data-theme="dark"] .z-variable.z-language {
441
+
color: #8bd5ca;
442
+
}
443
+
html[data-theme="dark"] .z-entity.z-name.z-tag {
444
+
color: #f5a97f;
445
+
}
446
+
html[data-theme="dark"] .z-entity.z-other.z-attribute-name {
447
+
color: #c6a0f6;
448
+
font-style: italic;
449
+
}
450
+
html[data-theme="dark"] .z-punctuation.z-definition.z-tag {
451
+
color: #ee99a0;
452
+
}
453
+
html[data-theme="dark"] .z-markup.z-underline.z-link.z-markdown {
454
+
color: #f4dbd6;
455
+
text-decoration: underline;
456
+
font-style: italic;
457
+
}
458
+
html[data-theme="dark"] .z-meta.z-link.z-inline.z-description {
459
+
color: #b7bdf8;
460
+
font-weight: bold;
461
+
}
462
+
html[data-theme="dark"] .z-comment.z-block.z-markdown,
463
+
.z-meta.z-code-fence,
464
+
.z-markup.z-raw.z-code-fence,
465
+
.z-markup.z-raw.z-inline {
466
+
color: #8bd5ca;
467
+
font-style: italic;
468
+
}
469
+
html[data-theme="dark"] .z-punctuation.z-definition.z-heading,
470
+
.z-entity.z-name.z-section {
471
+
color: #8aadf4;
472
+
font-weight: bold;
473
+
}
474
+
html[data-theme="dark"] .z-markup.z-italic {
475
+
color: #ee99a0;
476
+
font-style: italic;
477
+
}
478
+
html[data-theme="dark"] .z-markup.z-bold {
479
+
color: #ee99a0;
480
+
font-weight: bold;
481
+
}
482
+
html[data-theme="dark"] .z-constant.z-character.z-escape {
483
+
color: #f5bde6;
484
+
}
485
+
html[data-theme="dark"]
486
+
.z-source.z-shell.z-bash
487
+
.z-meta.z-function.z-shell
488
+
.z-meta.z-compound.z-shell
489
+
.z-meta.z-function-call.z-identifier.z-shell {
490
+
color: #f5bde6;
491
+
}
492
+
html[data-theme="dark"] .z-variable.z-language.z-shell {
493
+
color: #ed8796;
494
+
font-style: italic;
495
+
}
496
+
html[data-theme="dark"]
497
+
.z-source.z-lua
498
+
.z-meta.z-function.z-lua
499
+
.z-meta.z-block.z-lua
500
+
.z-meta.z-mapping.z-value.z-lua
501
+
.z-meta.z-mapping.z-key.z-lua
502
+
.z-string.z-unquoted.z-key.z-lua {
503
+
color: #b7bdf8;
504
+
font-style: italic;
505
+
}
506
+
html[data-theme="dark"]
507
+
.z-source.z-lua
508
+
.z-meta.z-function.z-lua
509
+
.z-meta.z-block.z-lua
510
+
.z-meta.z-mapping.z-key.z-lua
511
+
.z-string.z-unquoted.z-key.z-lua {
512
+
color: #f0c6c6;
513
+
}
514
+
html[data-theme="dark"] .z-entity.z-name.z-constant.z-java {
515
+
color: #8bd5ca;
516
+
}
517
+
html[data-theme="dark"] .z-support.z-type.z-property-name.z-css {
518
+
color: #f0c6c6;
519
+
font-style: italic;
520
+
}
521
+
html[data-theme="dark"] .z-support.z-constant.z-property-value.z-css {
522
+
color: #cad3f5;
523
+
}
524
+
html[data-theme="dark"] .z-constant.z-numeric.z-suffix.z-css,
525
+
.z-keyword.z-other.z-unit.z-css {
526
+
color: #8bd5ca;
527
+
font-style: italic;
528
+
}
529
+
html[data-theme="dark"] .z-variable.z-other.z-custom-property.z-name.z-css,
530
+
.z-support.z-type.z-custom-property.z-name.z-css,
531
+
.z-punctuation.z-definition.z-custom-property.z-css {
532
+
color: #8bd5ca;
533
+
}
534
+
html[data-theme="dark"] .z-entity.z-name.z-tag.z-css {
535
+
color: #b7bdf8;
536
+
}
537
+
html[data-theme="dark"] .z-variable.z-other.z-sass {
538
+
color: #8bd5ca;
539
+
}
540
+
html[data-theme="dark"] .z-invalid {
541
+
color: #cad3f5;
542
+
background-color: #ed8796;
543
+
}
544
+
html[data-theme="dark"] .z-invalid.z-deprecated {
545
+
color: #cad3f5;
546
+
background-color: #c6a0f6;
547
+
}
548
+
html[data-theme="dark"] .z-meta.z-diff,
549
+
.z-meta.z-diff.z-header {
550
+
color: #6e738d;
551
+
}
552
+
html[data-theme="dark"] .z-markup.z-deleted {
553
+
color: #ed8796;
554
+
}
555
+
html[data-theme="dark"] .z-markup.z-inserted {
556
+
color: #a6da95;
557
+
}
558
+
html[data-theme="dark"] .z-markup.z-changed {
559
+
color: #eed49f;
560
+
}
561
+
html[data-theme="dark"] .z-message.z-error {
562
+
color: #ed8796;
563
+
}
+5
templates/head.html
+5
templates/head.html
···
77
77
type="text/css"
78
78
href="{{ get_url(path='css/style.css', trailing_slash=false) | safe }}"
79
79
/>
80
+
<link
81
+
rel="stylesheet"
82
+
type="text/css"
83
+
href="{{ get_url(path='css/syntax-theme.css', trailing_slash=false) | safe }}"
84
+
/>
80
85
{% endblock css %}
81
86
<script
82
87
src="{{ get_url(path='js/script.js', trailing_slash=false) | safe }}"