miki-template 2.2.3 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/.github/workflows/docs.yml +3 -1
  2. package/.github/workflows/release.yml +0 -5
  3. package/benchmarks/ejs-results.json +6 -6
  4. package/benchmarks/ejs.js +5 -3
  5. package/benchmarks/handlebars-results.json +6 -6
  6. package/benchmarks/handlebars.js +5 -8
  7. package/benchmarks/miki-results.json +6 -6
  8. package/benchmarks/miki.js +6 -3
  9. package/benchmarks/pug-results.json +6 -6
  10. package/benchmarks/pug.js +5 -3
  11. package/docs/api/async-render.md +88 -3
  12. package/docs/api/cache.md +90 -3
  13. package/docs/api/compile.md +131 -3
  14. package/docs/api/context-processors.md +80 -3
  15. package/docs/api/filters.md +223 -3
  16. package/docs/api/finder.md +97 -3
  17. package/docs/api/helpers.md +56 -3
  18. package/docs/api/i18n.md +160 -3
  19. package/docs/api/index.md +82 -28
  20. package/docs/api/libraries.md +210 -3
  21. package/docs/api/render-partial.md +84 -3
  22. package/docs/api/render.md +95 -3
  23. package/docs/api/security.md +148 -3
  24. package/docs/api/setup-express.md +78 -2
  25. package/docs/api/tags.md +138 -4
  26. package/docs/filter.md +0 -0
  27. package/docs/guide/advanced-usage.md +403 -6
  28. package/docs/guide/async-rendering.md +312 -4
  29. package/docs/guide/context-processors.md +261 -4
  30. package/docs/guide/custom-filters.md +315 -4
  31. package/docs/guide/custom-tags.md +275 -4
  32. package/docs/guide/filters.md +675 -3
  33. package/docs/guide/getting-started.md +109 -7
  34. package/docs/guide/installation.md +99 -4
  35. package/docs/guide/partial-templates.md +371 -4
  36. package/docs/guide/quick-start.md +228 -6
  37. package/docs/guide/security.md +348 -3
  38. package/docs/guide/tags.md +789 -6
  39. package/docs/guide/template-discovery.md +174 -4
  40. package/docs/guide/template-inheritance.md +277 -4
  41. package/docs/index.md +24 -42
  42. package/docs/integrations/elysia.md +4 -2
  43. package/docs/integrations/express.md +219 -219
  44. package/docs/integrations/fastify.md +4 -2
  45. package/docs/integrations/hono.md +4 -2
  46. package/docs/integrations/index.md +68 -68
  47. package/docs/integrations/koa.md +4 -2
  48. package/docs/integrations/nestjs.md +4 -2
  49. package/docs/integrations/tsed.md +4 -2
  50. package/docs/performance.md +45 -8
  51. package/ex.mjs +1 -1
  52. package/mkdocs.yml +0 -22
  53. package/overrides/main.html +1 -1
  54. package/package.json +1 -1
  55. package/requirements-docs.txt +2 -1
  56. package/src/codegen.js +905 -0
  57. package/src/context.js +42 -30
  58. package/src/filters.js +16 -0
  59. package/src/index.js +66 -61
  60. package/src/tags/control.js +15 -12
  61. package/src/utils.js +60 -0
  62. package/tests/filters.test.js +9 -0
  63. package/docs/javascripts/extra.js +0 -174
  64. package/docs/stylesheets/extra.css +0 -819
  65. package/overrides/partials/footer.html +0 -9
@@ -1,819 +0,0 @@
1
- :root {
2
- --md-primary-fg-color: #1a1a2e;
3
- --md-primary-fg-color--light: #2d2d44;
4
- --md-primary-fg-color--dark: #0f0f1a;
5
- --md-accent-fg-color: #e94560;
6
- --md-accent-fg-color--light: #ff6b81;
7
- --md-accent-fg-color--dark: #c23152;
8
- --md-default-bg-color: #ffffff;
9
- --md-default-fg-color: #2d2d44;
10
- --md-code-bg-color: #f8f9fa;
11
- --md-code-fg-color: #2d2d44;
12
- --md-typeset-a-color: #e94560;
13
- --md-typeset-mark-color: #fff3cd;
14
- --md-typeset-del-color: #f8d7da;
15
- --md-typeset-ins-color: #d4edda;
16
- --md-admonition-fg-color: #2d2d44;
17
- --md-shadow-color: rgba(0, 0, 0, 0.1);
18
- --md-footer-bg-color: #1a1a2e;
19
- --md-footer-fg-color: #b8b8b8;
20
- --md-footer-mask-color: linear-gradient(to bottom, transparent, #1a1a2e);
21
- }
22
-
23
- [data-md-color-scheme="slate"] {
24
- --md-primary-fg-color: #eaeaea;
25
- --md-primary-fg-color--light: #ffffff;
26
- --md-primary-fg-color--dark: #b8b8b8;
27
- --md-accent-fg-color: #e94560;
28
- --md-accent-fg-color--light: #ff6b81;
29
- --md-accent-fg-color--dark: #c23152;
30
- --md-default-bg-color: #0f0f1a;
31
- --md-default-fg-color: #eaeaea;
32
- --md-code-bg-color: #1a1a2e;
33
- --md-code-fg-color: #eaeaea;
34
- --md-typeset-a-color: #ff6b81;
35
- --md-typeset-mark-color: #5a4a00;
36
- --md-typeset-del-color: #5a1a1a;
37
- --md-typeset-ins-color: #1a5a1a;
38
- --md-admonition-fg-color: #eaeaea;
39
- --md-shadow-color: rgba(0, 0, 0, 0.4);
40
- --md-footer-bg-color: #0a0a12;
41
- --md-footer-fg-color: #b8b8b8;
42
- --md-footer-mask-color: linear-gradient(to bottom, transparent, #0a0a12);
43
- }
44
-
45
- [data-md-color-scheme="custom"] {
46
- --md-primary-fg-color: #1a1a2e;
47
- --md-primary-fg-color--light: #2d2d44;
48
- --md-primary-fg-color--dark: #0f0f1a;
49
- --md-accent-fg-color: #e94560;
50
- --md-accent-fg-color--light: #ff6b81;
51
- --md-accent-fg-color--dark: #c23152;
52
- --md-default-bg-color: #ffffff;
53
- --md-default-fg-color: #2d2d44;
54
- --md-code-bg-color: #f8f9fa;
55
- --md-code-fg-color: #2d2d44;
56
- --md-typeset-a-color: #e94560;
57
- --md-typeset-mark-color: #fff3cd;
58
- --md-typeset-del-color: #f8d7da;
59
- --md-typeset-ins-color: #d4edda;
60
- --md-admonition-fg-color: #2d2d44;
61
- --md-shadow-color: rgba(0, 0, 0, 0.1);
62
- --md-footer-bg-color: #1a1a2e;
63
- --md-footer-fg-color: #b8b8b8;
64
- --md-footer-mask-color: linear-gradient(to bottom, transparent, #1a1a2e);
65
- }
66
-
67
- .md-grid {
68
- max-width: 1440px;
69
- }
70
-
71
- .md-header {
72
- box-shadow: 0 2px 8px var(--md-shadow-color);
73
- }
74
-
75
- .md-header__inner {
76
- padding: 0.2rem 0.6rem;
77
- }
78
-
79
- .md-header__title {
80
- font-weight: 700;
81
- letter-spacing: -0.02em;
82
- }
83
-
84
- .md-nav__title {
85
- font-weight: 700;
86
- letter-spacing: -0.01em;
87
- }
88
-
89
- .md-nav__link {
90
- font-weight: 500;
91
- transition: color 0.2s ease;
92
- }
93
-
94
- .md-nav__link:hover {
95
- color: var(--md-accent-fg-color);
96
- }
97
-
98
- .md-tabs__link {
99
- font-weight: 600;
100
- letter-spacing: -0.01em;
101
- }
102
-
103
- .md-tabs__link--active {
104
- color: var(--md-accent-fg-color);
105
- border-bottom-color: var(--md-accent-fg-color);
106
- }
107
-
108
- .md-content {
109
- padding-top: 1.2rem;
110
- }
111
-
112
- .md-content__inner {
113
- padding-bottom: 2rem;
114
- }
115
-
116
- .md-typeset {
117
- font-size: 0.8rem;
118
- line-height: 1.7;
119
- letter-spacing: 0.01em;
120
- }
121
-
122
- .md-typeset h1 {
123
- font-weight: 800;
124
- letter-spacing: -0.03em;
125
- color: var(--md-primary-fg-color);
126
- margin-bottom: 0.8rem;
127
- padding-bottom: 0.3rem;
128
- border-bottom: 2px solid var(--md-accent-fg-color);
129
- display: inline-block;
130
- }
131
-
132
- .md-typeset h2 {
133
- font-weight: 700;
134
- letter-spacing: -0.02em;
135
- color: var(--md-primary-fg-color);
136
- margin-top: 2.5rem;
137
- padding-bottom: 0.2rem;
138
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
139
- }
140
-
141
- [data-md-color-scheme="slate"] .md-typeset h2 {
142
- border-bottom-color: rgba(255, 255, 255, 0.1);
143
- }
144
-
145
- .md-typeset h3 {
146
- font-weight: 600;
147
- letter-spacing: -0.01em;
148
- color: var(--md-primary-fg-color);
149
- margin-top: 2rem;
150
- }
151
-
152
- .md-typeset h4 {
153
- font-weight: 600;
154
- color: var(--md-primary-fg-color);
155
- }
156
-
157
- .md-typeset a {
158
- color: var(--md-typeset-a-color);
159
- text-decoration: none;
160
- font-weight: 500;
161
- border-bottom: 1px solid transparent;
162
- transition: border-bottom-color 0.2s ease;
163
- }
164
-
165
- .md-typeset a:hover {
166
- border-bottom-color: var(--md-typeset-a-color);
167
- }
168
-
169
- .md-typeset code {
170
- font-family: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;
171
- font-size: 0.85em;
172
- font-weight: 500;
173
- background-color: var(--md-code-bg-color);
174
- border-radius: 0.3rem;
175
- padding: 0.15rem 0.4rem;
176
- color: var(--md-code-fg-color);
177
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
178
- }
179
-
180
- .md-typeset pre code {
181
- border-radius: 0.5rem;
182
- padding: 1rem;
183
- font-size: 0.8rem;
184
- line-height: 1.6;
185
- box-shadow: 0 4px 12px var(--md-shadow-color);
186
- }
187
-
188
- .md-typeset pre {
189
- border-radius: 0.5rem;
190
- overflow: hidden;
191
- margin: 1.5rem 0;
192
- }
193
-
194
- .md-typeset .highlight {
195
- border-radius: 0.5rem;
196
- overflow: hidden;
197
- margin: 1.5rem 0;
198
- box-shadow: 0 4px 12px var(--md-shadow-color);
199
- }
200
-
201
- .md-typeset .highlight span {
202
- font-family: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;
203
- font-size: 0.8rem;
204
- }
205
-
206
- .md-typeset blockquote {
207
- border-left: 4px solid var(--md-accent-fg-color);
208
- background: linear-gradient(135deg, rgba(233, 69, 96, 0.05), rgba(233, 69, 96, 0.02));
209
- padding: 1rem 1.2rem;
210
- border-radius: 0 0.5rem 0.5rem 0;
211
- margin: 1.5rem 0;
212
- font-style: italic;
213
- color: var(--md-default-fg-color);
214
- }
215
-
216
- [data-md-color-scheme="slate"] .md-typeset blockquote {
217
- background: linear-gradient(135deg, rgba(233, 69, 96, 0.1), rgba(233, 69, 96, 0.05));
218
- }
219
-
220
- .md-typeset table:not([class]) {
221
- border-radius: 0.5rem;
222
- overflow: hidden;
223
- box-shadow: 0 2px 8px var(--md-shadow-color);
224
- margin: 1.5rem 0;
225
- }
226
-
227
- .md-typeset table:not([class]) th {
228
- background-color: var(--md-primary-fg-color);
229
- color: #ffffff;
230
- font-weight: 600;
231
- text-transform: uppercase;
232
- font-size: 0.75rem;
233
- letter-spacing: 0.05em;
234
- padding: 0.8rem 1rem;
235
- }
236
-
237
- .md-typeset table:not([class]) td {
238
- padding: 0.7rem 1rem;
239
- border-bottom: 1px solid rgba(0, 0, 0, 0.05);
240
- }
241
-
242
- [data-md-color-scheme="slate"] .md-typeset table:not([class]) td {
243
- border-bottom-color: rgba(255, 255, 255, 0.05);
244
- }
245
-
246
- .md-typeset table:not([class]) tr:hover td {
247
- background-color: rgba(233, 69, 96, 0.05);
248
- }
249
-
250
- [data-md-color-scheme="slate"] .md-typeset table:not([class]) tr:hover td {
251
- background-color: rgba(233, 69, 96, 0.1);
252
- }
253
-
254
- .md-typeset .admonition,
255
- .md-typeset details {
256
- border-radius: 0.5rem;
257
- box-shadow: 0 2px 8px var(--md-shadow-color);
258
- margin: 1.5rem 0;
259
- overflow: hidden;
260
- }
261
-
262
- .md-typeset .admonition-title,
263
- .md-typeset details > summary {
264
- font-weight: 600;
265
- letter-spacing: -0.01em;
266
- border-radius: 0.5rem 0.5rem 0 0;
267
- }
268
-
269
- .md-typeset .admonition {
270
- border-left-width: 0;
271
- }
272
-
273
- .md-typeset .admonition.note { border-top: 4px solid #1976d2; }
274
- .md-typeset .admonition.abstract { border-top: 4px solid #1976d2; }
275
- .md-typeset .admonition.info { border-top: 4px solid #0288d1; }
276
- .md-typeset .admonition.tip { border-top: 4px solid #388e3c; }
277
- .md-typeset .admonition.success { border-top: 4px solid #2e7d32; }
278
- .md-typeset .admonition.question { border-top: 4px solid #7b1fa2; }
279
- .md-typeset .admonition.warning { border-top: 4px solid #f57c00; }
280
- .md-typeset .admonition.failure { border-top: 4px solid #d32f2f; }
281
- .md-typeset .admonition.danger { border-top: 4px solid #c62828; }
282
- .md-typeset .admonition.bug { border-top: 4px solid #e94560; }
283
- .md-typeset .admonition.example { border-top: 4px solid #5c6bc0; }
284
- .md-typeset .admonition.quote { border-top: 4px solid #78909c; }
285
-
286
- .md-typeset .admonition-title::before,
287
- .md-typeset details > summary::before {
288
- opacity: 0.9;
289
- }
290
-
291
- .md-typeset .tabbed-set {
292
- border-radius: 0.5rem;
293
- overflow: hidden;
294
- box-shadow: 0 2px 8px var(--md-shadow-color);
295
- margin: 1.5rem 0;
296
- }
297
-
298
- .md-typeset .tabbed-set > input:checked + label {
299
- border-bottom-color: var(--md-accent-fg-color);
300
- color: var(--md-accent-fg-color);
301
- }
302
-
303
- .md-typeset .tabbed-set > label {
304
- font-weight: 600;
305
- transition: all 0.2s ease;
306
- }
307
-
308
- .md-typeset .tabbed-set > label:hover {
309
- color: var(--md-accent-fg-color);
310
- }
311
-
312
- .md-typeset .tabbed-set--alternate > label {
313
- border-radius: 0;
314
- }
315
-
316
- .md-typeset .tabbed-set--alternate > input:checked + label {
317
- border-radius: 0;
318
- background-color: var(--md-accent-fg-color);
319
- color: #ffffff;
320
- }
321
-
322
- .md-typeset .tabbed-set--alternate > input:checked + label:hover {
323
- background-color: var(--md-accent-fg-color--dark);
324
- }
325
-
326
- .md-typeset .tabbed-set--alternate > label:hover {
327
- background-color: rgba(233, 69, 96, 0.1);
328
- }
329
-
330
- .md-typeset .task-list-item {
331
- font-family: inherit;
332
- }
333
-
334
- .md-typeset .task-list-item input[type="checkbox"] {
335
- appearance: none;
336
- width: 1.1rem;
337
- height: 1.1rem;
338
- border: 2px solid var(--md-accent-fg-color);
339
- border-radius: 0.25rem;
340
- cursor: pointer;
341
- position: relative;
342
- transition: all 0.2s ease;
343
- }
344
-
345
- .md-typeset .task-list-item input[type="checkbox"]:checked {
346
- background-color: var(--md-accent-fg-color);
347
- border-color: var(--md-accent-fg-color);
348
- }
349
-
350
- .md-typeset .task-list-item input[type="checkbox"]:checked::after {
351
- content: "";
352
- position: absolute;
353
- left: 0.35rem;
354
- top: 0.15rem;
355
- width: 0.3rem;
356
- height: 0.6rem;
357
- border: solid #ffffff;
358
- border-width: 0 2px 2px 0;
359
- transform: rotate(45deg);
360
- }
361
-
362
- .md-typeset hr {
363
- border-top: 2px solid var(--md-accent-fg-color);
364
- margin: 2.5rem 0;
365
- opacity: 0.3;
366
- }
367
-
368
- .md-typeset img {
369
- border-radius: 0.5rem;
370
- box-shadow: 0 4px 12px var(--md-shadow-color);
371
- }
372
-
373
- .md-typeset .md-button {
374
- border-radius: 0.5rem;
375
- font-weight: 600;
376
- text-transform: none;
377
- letter-spacing: -0.01em;
378
- transition: all 0.2s ease;
379
- box-shadow: 0 2px 8px var(--md-shadow-color);
380
- }
381
-
382
- .md-typeset .md-button:hover {
383
- transform: translateY(-2px);
384
- box-shadow: 0 4px 12px var(--md-shadow-color);
385
- }
386
-
387
- .md-typeset .md-button--primary {
388
- background-color: var(--md-accent-fg-color);
389
- color: #ffffff;
390
- }
391
-
392
- .md-typeset .md-button--primary:hover {
393
- background-color: var(--md-accent-fg-color--dark);
394
- }
395
-
396
- .md-search__form {
397
- border-radius: 2rem;
398
- overflow: hidden;
399
- }
400
-
401
- .md-search__input {
402
- border-radius: 2rem;
403
- padding-left: 2.5rem;
404
- }
405
-
406
- .md-search__input::placeholder {
407
- color: var(--md-default-fg-color);
408
- opacity: 0.6;
409
- }
410
-
411
- .md-search__icon {
412
- color: var(--md-default-fg-color);
413
- opacity: 0.6;
414
- }
415
-
416
- .md-clipboard {
417
- color: var(--md-default-fg-color);
418
- opacity: 0;
419
- transition: opacity 0.2s ease;
420
- }
421
-
422
- .md-clipboard:hover {
423
- opacity: 1;
424
- color: var(--md-accent-fg-color);
425
- }
426
-
427
- .md-source__icon {
428
- color: var(--md-default-fg-color);
429
- opacity: 0.6;
430
- }
431
-
432
- .md-source__icon:hover {
433
- color: var(--md-accent-fg-color);
434
- }
435
-
436
- .md-footer {
437
- background-color: var(--md-footer-bg-color);
438
- color: var(--md-footer-fg-color);
439
- }
440
-
441
- .md-footer-meta {
442
- background-color: var(--md-footer-bg-color);
443
- }
444
-
445
- .md-footer-meta__inner {
446
- padding: 1rem 0;
447
- }
448
-
449
- .md-footer-copyright {
450
- color: var(--md-footer-fg-color);
451
- font-size: 0.75rem;
452
- }
453
-
454
- .md-footer-copyright__highlight {
455
- color: var(--md-accent-fg-color);
456
- }
457
-
458
- .md-footer__link {
459
- color: var(--md-footer-fg-color);
460
- font-size: 0.8rem;
461
- font-weight: 500;
462
- transition: color 0.2s ease;
463
- }
464
-
465
- .md-footer__link:hover {
466
- color: var(--md-accent-fg-color);
467
- }
468
-
469
- .md-footer__title {
470
- color: #ffffff;
471
- font-weight: 700;
472
- }
473
-
474
- .md-social__link {
475
- color: var(--md-footer-fg-color);
476
- transition: color 0.2s ease;
477
- }
478
-
479
- .md-social__link:hover {
480
- color: var(--md-accent-fg-color);
481
- }
482
-
483
- .md-banner {
484
- background: linear-gradient(135deg, var(--md-accent-fg-color), var(--md-accent-fg-color--dark));
485
- color: #ffffff;
486
- font-weight: 500;
487
- text-align: center;
488
- padding: 0.8rem 1rem;
489
- }
490
-
491
- .md-banner__inner {
492
- display: flex;
493
- align-items: center;
494
- justify-content: center;
495
- gap: 0.5rem;
496
- }
497
-
498
- .md-banner__inner a {
499
- color: #ffffff;
500
- text-decoration: underline;
501
- font-weight: 600;
502
- }
503
-
504
- .md-banner__inner a:hover {
505
- opacity: 0.9;
506
- }
507
-
508
- .md-banner__button {
509
- color: #ffffff;
510
- opacity: 0.8;
511
- transition: opacity 0.2s ease;
512
- }
513
-
514
- .md-banner__button:hover {
515
- opacity: 1;
516
- }
517
-
518
- .md-announce {
519
- background: linear-gradient(135deg, #1a1a2e, #2d2d44);
520
- color: #ffffff;
521
- font-weight: 500;
522
- text-align: center;
523
- padding: 0.8rem 1rem;
524
- border-bottom: 1px solid rgba(233, 69, 96, 0.3);
525
- }
526
-
527
- .md-announce__inner {
528
- display: flex;
529
- align-items: center;
530
- justify-content: center;
531
- gap: 0.5rem;
532
- }
533
-
534
- .md-announce__inner a {
535
- color: var(--md-accent-fg-color--light);
536
- text-decoration: underline;
537
- font-weight: 600;
538
- }
539
-
540
- .md-announce__inner a:hover {
541
- color: #ffffff;
542
- }
543
-
544
- .md-announce__button {
545
- color: #ffffff;
546
- opacity: 0.8;
547
- transition: opacity 0.2s ease;
548
- }
549
-
550
- .md-announce__button:hover {
551
- opacity: 1;
552
- }
553
-
554
- .md-version {
555
- background: linear-gradient(135deg, var(--md-accent-fg-color), var(--md-accent-fg-color--dark));
556
- color: #ffffff;
557
- font-weight: 600;
558
- padding: 0.3rem 0.8rem;
559
- border-radius: 2rem;
560
- font-size: 0.75rem;
561
- text-transform: uppercase;
562
- letter-spacing: 0.05em;
563
- }
564
-
565
- .md-version__list {
566
- background-color: var(--md-primary-fg-color);
567
- border-radius: 0.5rem;
568
- box-shadow: 0 4px 12px var(--md-shadow-color);
569
- overflow: hidden;
570
- }
571
-
572
- .md-version__item {
573
- padding: 0.6rem 1rem;
574
- border-bottom: 1px solid rgba(255, 255, 255, 0.1);
575
- transition: background-color 0.2s ease;
576
- }
577
-
578
- .md-version__item:hover {
579
- background-color: rgba(233, 69, 96, 0.1);
580
- }
581
-
582
- .md-version__item--selected {
583
- background-color: var(--md-accent-fg-color);
584
- color: #ffffff;
585
- }
586
-
587
- .md-version__item--selected:hover {
588
- background-color: var(--md-accent-fg-color--dark);
589
- }
590
-
591
- .md-top {
592
- background-color: var(--md-primary-fg-color);
593
- color: #ffffff;
594
- border-radius: 50%;
595
- width: 2.5rem;
596
- height: 2.5rem;
597
- display: flex;
598
- align-items: center;
599
- justify-content: center;
600
- box-shadow: 0 2px 8px var(--md-shadow-color);
601
- transition: all 0.2s ease;
602
- }
603
-
604
- .md-top:hover {
605
- background-color: var(--md-accent-fg-color);
606
- transform: translateY(-3px);
607
- }
608
-
609
- .md-pagination {
610
- border-top: 1px solid rgba(0, 0, 0, 0.05);
611
- margin-top: 3rem;
612
- padding-top: 1.5rem;
613
- }
614
-
615
- [data-md-color-scheme="slate"] .md-pagination {
616
- border-top-color: rgba(255, 255, 255, 0.05);
617
- }
618
-
619
- .md-pagination__link {
620
- border-radius: 0.5rem;
621
- padding: 1rem;
622
- transition: all 0.2s ease;
623
- border: 1px solid rgba(0, 0, 0, 0.05);
624
- }
625
-
626
- [data-md-color-scheme="slate"] .md-pagination__link {
627
- border-color: rgba(255, 255, 255, 0.05);
628
- }
629
-
630
- .md-pagination__link:hover {
631
- border-color: var(--md-accent-fg-color);
632
- box-shadow: 0 2px 8px var(--md-shadow-color);
633
- }
634
-
635
- .md-pagination__title {
636
- color: var(--md-primary-fg-color);
637
- font-weight: 600;
638
- }
639
-
640
- .md-pagination__direction {
641
- color: var(--md-accent-fg-color);
642
- font-weight: 600;
643
- text-transform: uppercase;
644
- font-size: 0.75rem;
645
- letter-spacing: 0.05em;
646
- }
647
-
648
- .md-sidebar {
649
- border-right: 1px solid rgba(0, 0, 0, 0.05);
650
- }
651
-
652
- [data-md-color-scheme="slate"] .md-sidebar {
653
- border-right-color: rgba(255, 255, 255, 0.05);
654
- }
655
-
656
- .md-sidebar__scrollwrap {
657
- padding-top: 0.5rem;
658
- }
659
-
660
- .md-sidebar__item {
661
- margin: 0.2rem 0;
662
- }
663
-
664
- .md-sidebar__item--active {
665
- border-radius: 0.3rem;
666
- }
667
-
668
- .md-sidebar__item--active > .md-sidebar__link {
669
- color: var(--md-accent-fg-color);
670
- font-weight: 600;
671
- }
672
-
673
- .md-sidebar__item--active > .md-sidebar__link::before {
674
- background-color: var(--md-accent-fg-color);
675
- }
676
-
677
- .md-tabs {
678
- background-color: var(--md-primary-fg-color);
679
- border-bottom: 1px solid rgba(255, 255, 255, 0.1);
680
- }
681
-
682
- .md-tabs__item {
683
- margin: 0 0.2rem;
684
- }
685
-
686
- .md-tabs__link {
687
- color: rgba(255, 255, 255, 0.8);
688
- border-radius: 0.3rem 0.3rem 0 0;
689
- padding: 0.5rem 1rem;
690
- font-weight: 500;
691
- transition: all 0.2s ease;
692
- }
693
-
694
- .md-tabs__link:hover {
695
- color: #ffffff;
696
- background-color: rgba(255, 255, 255, 0.1);
697
- }
698
-
699
- .md-tabs__link--active {
700
- color: #ffffff;
701
- background-color: rgba(233, 69, 96, 0.2);
702
- border-bottom-color: transparent;
703
- }
704
-
705
- [data-md-color-scheme="default"] .md-tabs {
706
- background-color: var(--md-primary-fg-color);
707
- }
708
-
709
- [data-md-color-scheme="default"] .md-tabs__link {
710
- color: rgba(255, 255, 255, 0.8);
711
- }
712
-
713
- [data-md-color-scheme="default"] .md-tabs__link:hover {
714
- color: #ffffff;
715
- background-color: rgba(255, 255, 255, 0.1);
716
- }
717
-
718
- [data-md-color-scheme="default"] .md-tabs__link--active {
719
- color: #ffffff;
720
- background-color: rgba(233, 69, 96, 0.2);
721
- }
722
-
723
- .md-content__inner h1:first-of-type {
724
- margin-top: 0;
725
- }
726
-
727
- .md-content__inner > h1:first-of-type {
728
- font-size: 2.5rem;
729
- margin-bottom: 1rem;
730
- }
731
-
732
- .md-hero {
733
- background: linear-gradient(135deg, var(--md-primary-fg-color) 0%, var(--md-accent-fg-color--dark) 100%);
734
- color: #ffffff;
735
- padding: 4rem 2rem;
736
- border-radius: 1rem;
737
- margin-bottom: 2rem;
738
- text-align: center;
739
- position: relative;
740
- overflow: hidden;
741
- box-shadow: 0 8px 24px var(--md-shadow-color);
742
- }
743
-
744
- .md-hero::before {
745
- content: "";
746
- position: absolute;
747
- top: -50%;
748
- left: -50%;
749
- width: 200%;
750
- height: 200%;
751
- background: radial-gradient(circle, rgba(233, 69, 96, 0.1) 0%, transparent 70%);
752
- animation: pulse 8s ease-in-out infinite;
753
- }
754
-
755
- @keyframes pulse {
756
- 0%, 100% { transform: scale(1); opacity: 0.5; }
757
- 50% { transform: scale(1.1); opacity: 1; }
758
- }
759
-
760
- .md-hero__title {
761
- font-size: 3rem;
762
- font-weight: 800;
763
- letter-spacing: -0.03em;
764
- margin-bottom: 1rem;
765
- position: relative;
766
- }
767
-
768
- .md-hero__subtitle {
769
- font-size: 1.25rem;
770
- opacity: 0.9;
771
- max-width: 600px;
772
- margin: 0 auto 2rem;
773
- position: relative;
774
- }
775
-
776
- .md-hero__buttons {
777
- display: flex;
778
- gap: 1rem;
779
- justify-content: center;
780
- flex-wrap: wrap;
781
- position: relative;
782
- }
783
-
784
- .md-hero__buttons .md-button {
785
- padding: 0.8rem 1.5rem;
786
- font-size: 1rem;
787
- border-radius: 0.5rem;
788
- font-weight: 600;
789
- text-transform: none;
790
- letter-spacing: -0.01em;
791
- transition: all 0.2s ease;
792
- }
793
-
794
- .md-hero__buttons .md-button--primary {
795
- background-color: var(--md-accent-fg-color);
796
- color: #ffffff;
797
- box-shadow: 0 4px 12px rgba(233, 69, 96, 0.3);
798
- }
799
-
800
- .md-hero__buttons .md-button--primary:hover {
801
- background-color: var(--md-accent-fg-color--dark);
802
- transform: translateY(-2px);
803
- box-shadow: 0 6px 16px rgba(233, 69, 96, 0.4);
804
- }
805
-
806
- .md-hero__buttons .md-button {
807
- background-color: rgba(255, 255, 255, 0.1);
808
- color: #ffffff;
809
- border: 1px solid rgba(255, 255, 255, 0.2);
810
- }
811
-
812
- .md-hero__buttons .md-button:hover {
813
- background-color: rgba(255, 255, 255, 0.2);
814
- transform: translateY(-2px);
815
- }
816
-
817
- .md-grid__item {
818
- padding: 0 0.8rem;
819
- }