robindoc 0.0.0-experimental-b4f8a34 → 0.0.0-experimental-233a626

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 (2) hide show
  1. package/lib/styles.css +705 -691
  2. package/package.json +1 -1
package/lib/styles.css CHANGED
@@ -1,9 +1,115 @@
1
- .r-footer {
1
+ .r-header {
2
+ position: sticky;
3
+ background-color: var(--r-main-50);
4
+ top: 0;
5
+ border-bottom: 1px solid var(--r-main-300);
6
+ height: 60px;
7
+ z-index: 1000;
8
+ box-sizing: border-box;
9
+ }
10
+
11
+ .r-header-body.r-header-body {
12
+ height: 100%;
13
+ display: flex;
14
+ justify-content: space-between;
15
+ align-items: center;
16
+ gap: 24px;
17
+ box-sizing: border-box;
18
+ padding-left: 12px;
19
+ padding-right: 12px;
20
+ }
21
+ @media screen and (width >= 1024px) {
22
+ .r-header-body.r-header-body {
23
+ padding-left: 24px;
24
+ padding-right: 24px;
25
+ }
26
+ }
27
+
28
+ .r-header-logo {
29
+ display: block;
30
+ margin-right: 24px;
31
+ color: var(--r-main-700);
32
+ transition: color 0.2s;
33
+ box-sizing: border-box;
34
+ font-size: 1.25rem;
35
+ font-weight: 600;
36
+ text-decoration: none;
37
+ }
38
+ .r-header-logo:hover, .r-header-logo:focus {
39
+ color: var(--r-main-950);
40
+ }
41
+
42
+ .r-header-nav {
43
+ display: flex;
44
+ flex-direction: column;
45
+ gap: 12px 16px;
46
+ }
47
+ @media screen and (width >= 1024px) {
48
+ .r-header-nav {
49
+ flex-direction: row;
50
+ }
51
+ }
52
+
53
+ .r-header-link {
54
+ color: var(--r-main-600);
55
+ text-decoration: none;
56
+ padding: 4px 0;
57
+ transition: color 0.2s;
58
+ box-sizing: border-box;
59
+ }
60
+ .r-header-link:hover, .r-header-link:focus-visible {
61
+ color: var(--r-main-950);
62
+ }
63
+
64
+ .r-header-link._target {
65
+ color: var(--r-primary-800);
66
+ }
67
+ .r-header-link._target:hover, .r-header-link._target:focus-visible {
68
+ color: var(--r-primary-700);
69
+ }
70
+
71
+ .r-header-actions {
72
+ display: flex;
73
+ flex-direction: column-reverse;
74
+ gap: 16px;
75
+ align-items: stretch;
76
+ }
77
+ @media screen and (width >= 1024px) {
78
+ .r-header-actions {
79
+ flex-direction: row;
80
+ align-items: center;
81
+ gap: 28px;
82
+ }
83
+ }
84
+
85
+ .r-header-sections {
86
+ display: flex;
87
+ align-items: center;
88
+ gap: 12px;
89
+ }
90
+ @media screen and (width < 768px) {
91
+ .r-header-sections .r-dropdown {
92
+ flex: 1;
93
+ }
94
+ }
95
+ @media screen and (width < 768px) {
96
+ .r-header-sections .r-dropdown-drop {
97
+ max-width: none;
98
+ width: 100%;
99
+ left: 0;
100
+ }
101
+ }.r-footer {
2
102
  border-top: 1px solid var(--r-main-300);
3
103
  }
4
104
 
5
105
  .r-footer-container.r-footer-container {
6
- padding: 16px 24px;
106
+ padding: 16px 12px;
107
+ }
108
+ @media screen and (width >= 1024px) {
109
+ .r-footer-container.r-footer-container {
110
+ padding-left: 24px;
111
+ padding-right: 24px;
112
+ }
7
113
  }
8
114
 
9
115
  .r-footer-row {
@@ -304,184 +410,360 @@
304
410
  grid-template-columns: 760px 220px;
305
411
  grid-template-rows: auto 1fr auto;
306
412
  }
307
- }.r-header {
308
- position: sticky;
309
- background-color: var(--r-main-50);
310
- top: 0;
311
- border-bottom: 1px solid var(--r-main-300);
312
- height: 60px;
313
- z-index: 1000;
413
+ }.r-page-container {
414
+ min-height: calc(100dvh - var(--r-header-height));
415
+ overflow-wrap: break-word;
314
416
  box-sizing: border-box;
417
+ }.keylink-to-content {
418
+ position: absolute !important;
419
+ top: 8px;
420
+ left: 12px;
421
+ z-index: 1001;
422
+ }.r-keylink.keylink-to-navigation:focus {
423
+ margin-top: -40px;
424
+ }.r-article {
425
+ padding: 20px 0 40px;
426
+ grid-area: content;
315
427
  }
316
-
317
- .r-header-body.r-header-body {
318
- height: 100%;
319
- display: flex;
320
- justify-content: space-between;
321
- align-items: center;
322
- gap: 24px;
323
- box-sizing: border-box;
324
- padding-left: 24px;
325
- padding-right: 24px;
428
+ @media screen and (width >= 1180px) {
429
+ .r-article {
430
+ padding: 32px 0 40px;
431
+ }
432
+ }
433
+ .r-article > *:first-child {
434
+ margin-top: 0;
435
+ }
436
+ .r-article > *:last-child {
437
+ margin-bottom: 0;
326
438
  }
327
439
 
328
- .r-header-logo {
329
- display: block;
330
- margin-right: 24px;
331
- color: var(--r-main-700);
332
- transition: color 0.2s;
440
+ .r-checkbox {
441
+ cursor: pointer;
442
+ width: 20px;
443
+ height: 20px;
444
+ margin: 4px;
445
+ vertical-align: middle;
333
446
  box-sizing: border-box;
334
- font-size: 1.25rem;
335
- font-weight: 600;
336
- text-decoration: none;
337
- }
338
- .r-header-logo:hover, .r-header-logo:focus {
339
- color: var(--r-main-950);
340
447
  }
341
448
 
342
- .r-header-nav {
343
- display: flex;
344
- flex-direction: column;
345
- gap: 12px 16px;
449
+ .r-label {
450
+ cursor: pointer;
346
451
  }
347
- @media screen and (width >= 1024px) {
348
- .r-header-nav {
349
- flex-direction: row;
350
- }
452
+
453
+ .r-task-ol,
454
+ .r-task-ul {
455
+ list-style: none;
351
456
  }
352
457
 
353
- .r-header-link {
354
- color: var(--r-main-600);
355
- text-decoration: none;
356
- padding: 4px 0;
357
- transition: color 0.2s;
458
+ .r-task-label {
459
+ display: block;
460
+ width: 100%;
461
+ padding-top: 2px;
462
+ padding-bottom: 2px;
358
463
  box-sizing: border-box;
359
464
  }
360
- .r-header-link:hover, .r-header-link:focus-visible {
361
- color: var(--r-main-950);
465
+ .r-task-label:hover .r-checkbox {
466
+ filter: brightness(0.8);
362
467
  }
363
468
 
364
- .r-header-link._target {
365
- color: var(--r-primary-800);
366
- }
367
- .r-header-link._target:hover, .r-header-link._target:focus-visible {
368
- color: var(--r-primary-700);
469
+ .r-task-li.r-task-li {
470
+ margin-block-start: 2px;
471
+ margin-block-end: 2px;
369
472
  }
370
473
 
371
- .r-header-actions {
372
- display: flex;
373
- flex-direction: column-reverse;
374
- gap: 16px;
375
- align-items: stretch;
474
+ .r-label-text {
475
+ vertical-align: middle;
476
+ }.r-sidebar {
477
+ grid-area: sidebar;
478
+ box-sizing: border-box;
376
479
  }
377
- @media screen and (width >= 1024px) {
378
- .r-header-actions {
379
- flex-direction: row;
380
- align-items: center;
381
- gap: 28px;
480
+ @media screen and (width < 768px) {
481
+ .r-sidebar {
482
+ position: sticky;
483
+ width: calc(100% + 24px);
484
+ top: var(--r-header-height);
485
+ left: 0;
486
+ margin: 0 -12px;
487
+ background-color: var(--r-main-50);
488
+ border-bottom: 1px solid var(--r-main-200);
489
+ z-index: 10;
490
+ opacity: 0.98;
491
+ padding: 0;
492
+ overflow: auto;
382
493
  }
383
494
  }
384
495
 
385
- .r-header-sections {
386
- display: flex;
387
- align-items: center;
388
- gap: 12px;
496
+ .r-sidebar-top-mock {
497
+ grid-row-start: 1;
498
+ grid-column-start: 1;
389
499
  }
500
+
390
501
  @media screen and (width < 768px) {
391
- .r-header-sections .r-dropdown {
392
- flex: 1;
502
+ .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
503
+ display: none;
393
504
  }
394
505
  }
506
+
507
+ .r-sidebar-nav {
508
+ box-sizing: border-box;
509
+ }
395
510
  @media screen and (width < 768px) {
396
- .r-header-sections .r-dropdown-drop {
397
- max-width: none;
398
- width: 100%;
399
- left: 0;
511
+ .r-sidebar-nav {
512
+ overflow: auto;
513
+ max-height: calc(100dvh - var(--r-header-height) - 41px);
400
514
  }
401
- }.r-page-container {
402
- min-height: calc(100dvh - var(--r-header-height));
403
- overflow-wrap: break-word;
404
- box-sizing: border-box;
405
- }.keylink-to-content {
406
- position: absolute !important;
407
- top: 8px;
408
- left: 12px;
409
- z-index: 1001;
410
- }.r-keylink.keylink-to-navigation:focus {
411
- margin-top: -40px;
412
- }.r-container {
413
- max-width: 1180px;
414
- padding-right: 12px;
415
- padding-left: 12px;
416
- margin-right: auto;
417
- margin-left: auto;
418
- box-sizing: border-box;
419
- }.r-theme-switcher {
515
+ }
516
+
517
+ .r-sidebar-drop {
518
+ margin-top: -4px;
519
+ padding-top: 4px;
520
+ }
521
+
522
+ .r-sidebar-sublist {
420
523
  position: relative;
421
- display: flex;
422
- gap: 4px;
423
- width: 109px;
424
- height: 37px;
425
- padding: 2px;
426
- background-color: var(--r-main-100);
427
- border: 1px solid var(--r-main-200);
428
- border-radius: 100px;
429
- box-sizing: border-box;
524
+ padding-top: 2px;
430
525
  }
431
- .r-theme-switcher::before {
526
+ .r-sidebar-sublist:hover::before {
527
+ background-color: var(--r-primary-800);
528
+ transition-delay: initial;
529
+ }
530
+
531
+ .r-sidebar-sublist::before {
432
532
  content: "";
433
533
  position: absolute;
434
- display: block;
435
- height: 32px;
436
- width: 32px;
437
- top: 2px;
438
- left: 2px;
439
- background-color: var(--r-main-50);
440
- border: 1px solid var(--r-main-200);
441
- border-radius: 100px;
442
- transition: left 0.2s;
534
+ top: 0;
535
+ left: -12px;
536
+ right: 0;
537
+ height: 2px;
538
+ border-bottom-left-radius: 2px;
539
+ background-color: var(--r-main-200);
540
+ z-index: 1;
541
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
443
542
  box-sizing: border-box;
444
543
  }
445
544
 
446
- .r-theme-switcher-btn {
447
- padding: 8px;
448
- background: none;
545
+ .r-sidebar-nav {
546
+ padding: 32px 4px 32px 2px;
547
+ box-sizing: border-box;
548
+ }
549
+ @media screen and (width < 768px) {
550
+ .r-sidebar-nav {
551
+ padding: 12px;
552
+ }
553
+ }
554
+ @media screen and (width >= 768px) {
555
+ .r-sidebar-nav {
556
+ position: sticky;
557
+ top: var(--r-header-height);
558
+ overflow: auto;
559
+ scrollbar-width: thin;
560
+ scrollbar-color: var(--r-main-200) transparent;
561
+ scrollbar-gutter: stable;
562
+ max-height: calc(100dvh - var(--r-header-height));
563
+ }
564
+ }
565
+
566
+ .r-sidebar-space {
567
+ box-sizing: border-box;
568
+ }
569
+ @media screen and (width < 768px) {
570
+ .r-sidebar-space {
571
+ display: block;
572
+ height: 40px;
573
+ }
574
+ }
575
+
576
+ .r-sidebar-btn {
577
+ position: sticky;
578
+ top: 0;
579
+ display: flex;
580
+ width: 100%;
581
+ font-size: 14px;
449
582
  border: 0;
450
- border-radius: 100px;
583
+ padding: 12px;
584
+ background: none;
451
585
  cursor: pointer;
452
- color: var(--r-main-700);
453
- fill: transparent;
586
+ color: var(--r-main-800);
587
+ background-color: var(--r-main-50);
454
588
  z-index: 1;
455
- transition: color 0.2s 0.1s, fill 0.2s;
589
+ box-sizing: border-box;
456
590
  }
457
- .r-theme-switcher-btn:hover {
458
- color: var(--r-main-950);
459
- fill: var(--r-main-600);
591
+ @media screen and (width >= 768px) {
592
+ .r-sidebar-btn {
593
+ display: none;
594
+ }
460
595
  }
461
596
 
462
- .r-theme-dark:not(.r-theme-system) .r-theme-switcher::before {
463
- left: 2px;
597
+ .r-sidebar-chevron {
598
+ display: inline;
599
+ margin-right: 6px;
600
+ transition: transform 0.2s;
601
+ box-sizing: border-box;
464
602
  }
465
603
 
466
- .r-theme-dark:not(.r-theme-system) .r-theme-switcher-btn__dark,
467
- .r-theme-system .r-theme-switcher-btn__system,
468
- .r-theme-light:not(.r-theme-system) .r-theme-switcher-btn__light {
469
- color: var(--r-main-950);
470
- fill: var(--r-main-950);
471
- pointer-events: none;
604
+ .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
605
+ transform: rotate(90deg);
472
606
  }
473
607
 
474
- .r-theme-switcher::before,
475
- .r-theme-system .r-theme-switcher::before {
476
- left: 38px;
608
+ .r-sidebar-list {
609
+ color: var(--r-main-700);
610
+ list-style: none;
611
+ padding: 0;
612
+ margin: 0;
613
+ font-size: 14px;
614
+ box-sizing: border-box;
477
615
  }
478
616
 
479
- .r-theme-light:not(.r-theme-system) .r-theme-switcher::before {
480
- left: 74px;
617
+ .r-sidebar-drop::details-content {
618
+ overflow: hidden;
619
+ transition: content-visibility 0.4s allow-discrete;
620
+ box-sizing: border-box;
481
621
  }
482
622
 
483
- .r-theme-switcher-svg {
623
+ .r-sidebar-sublist {
624
+ margin-left: 12px;
625
+ }
626
+
627
+ .r-sidebar-drop > .r-sidebar-sublist {
628
+ opacity: 0;
629
+ transition: opacity 0.2s ease;
630
+ }
631
+
632
+ .r-sidebar-drop[open] > .r-sidebar-sublist {
633
+ opacity: 1;
634
+ }
635
+
636
+ .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
637
+ margin-top: -4rem;
638
+ transition: margin-top 0.3s ease;
639
+ }
640
+
641
+ @starting-style {
642
+ .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
643
+ margin-top: -4rem;
644
+ }
645
+ }
646
+
647
+ .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
648
+ margin-top: 0;
649
+ }
650
+
651
+ .r-sidebar-sublist .r-sidebar-link {
652
+ position: relative;
653
+ border-top-left-radius: 0;
654
+ border-bottom-left-radius: 0;
655
+ box-sizing: border-box;
656
+ }
657
+ .r-sidebar-sublist .r-sidebar-link::before {
658
+ content: "";
659
+ position: absolute;
660
+ left: 0;
661
+ top: -1px;
662
+ width: 1px;
663
+ height: calc(100% + 4px);
664
+ background-color: var(--r-main-200);
665
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
666
+ box-sizing: border-box;
667
+ }
668
+
669
+ .r-sidebar-li {
670
+ position: relative;
671
+ line-height: 1.5;
672
+ }
673
+
674
+ .r-sidebar-li._separator {
675
+ background: var(--r-main-200);
676
+ padding: 1px;
677
+ }
678
+
679
+ .r-sidebar-li._droppable > a {
680
+ padding-right: 32px;
681
+ }
682
+
683
+ .r-sidebar-li-d0 {
684
+ margin-left: -8px;
685
+ }
686
+
687
+ .r-sidebar-p {
688
+ margin: 0;
689
+ padding: 4px 10px;
690
+ }
691
+
692
+ .r-sidebar-heading {
693
+ color: var(--r-main-900);
694
+ font-weight: 600;
695
+ margin-block-end: 4px;
696
+ }
697
+ .r-sidebar-heading:not(:first-child) {
698
+ margin-block-start: 12px;
699
+ }
700
+
701
+ .r-sidebar-link {
702
+ padding: 4px 10px;
703
+ color: inherit;
704
+ border-bottom: 2px solid transparent;
705
+ border-radius: 2px;
706
+ text-decoration: none;
707
+ display: -webkit-box;
708
+ -webkit-box-orient: vertical;
709
+ -webkit-line-clamp: 3;
710
+ overflow: hidden;
711
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s, color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
712
+ }
713
+
714
+ .r-sidebar-link._target {
715
+ color: var(--r-primary-950);
716
+ background-color: var(--r-main-50);
717
+ }
718
+
719
+ .r-sidebar-link:hover {
720
+ color: var(--r-primary-800);
721
+ background-color: var(--r-main-100);
722
+ transition-delay: initial;
723
+ }
724
+ .r-sidebar-link:hover::before {
725
+ background-color: currentColor;
726
+ transition-delay: initial;
727
+ }
728
+
729
+ .r-sidebar-link._active {
730
+ color: var(--r-primary-700);
731
+ background-color: var(--r-main-50);
732
+ }
733
+ .r-sidebar-link._active::before {
734
+ background-color: currentColor;
735
+ }
736
+
737
+ .r-sidebar-drop-btn {
738
+ position: absolute;
739
+ right: 3px;
740
+ top: 5px;
741
+ border-radius: 4px;
742
+ padding: 4px;
743
+ list-style: none;
744
+ cursor: pointer;
745
+ transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
746
+ }
747
+ .r-sidebar-drop-btn:hover {
748
+ color: var(--r-primary-500);
749
+ transition-delay: initial;
750
+ }
751
+ .r-sidebar-drop-btn::before {
752
+ content: "";
753
+ position: absolute;
754
+ inset: -4px;
755
+ }
756
+ .r-sidebar-drop-btn::-webkit-details-marker {
757
+ display: none;
758
+ }
759
+
760
+ .r-sidebar-drop-icon {
484
761
  display: block;
762
+ transition: transform 0.2s;
763
+ }
764
+
765
+ .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
766
+ transform: rotate(90deg);
485
767
  }.r-header-menu {
486
768
  display: flex;
487
769
  justify-content: flex-end;
@@ -567,88 +849,9 @@
567
849
  transform: translateY(3px);
568
850
  }
569
851
 
570
- .r-header-input:checked ~ .r-header-burger .r-burger-line._bottom {
571
- transform: translateY(0) rotate(-45deg);
572
- margin-top: 0;
573
- }.r-dropdown {
574
- position: relative;
575
- color: var(--r-main-600);
576
- transition: color 0.2s 0.1s;
577
- }
578
- .r-dropdown:hover, .r-dropdown:focus-within {
579
- color: var(--r-main-950);
580
- }
581
- .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
582
- visibility: visible;
583
- pointer-events: all;
584
- transform: translateY(20px);
585
- opacity: 1;
586
- }
587
- .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
588
- transform: rotate(180deg);
589
- }
590
-
591
- .r-dropdown-summary {
592
- display: flex;
593
- justify-content: space-between;
594
- align-items: center;
595
- width: 100%;
596
- position: relative;
597
- color: inherit;
598
- cursor: pointer;
599
- padding: 10px 4px;
600
- font-size: 16px;
601
- border: 0;
602
- background: none;
603
- z-index: 1;
604
- box-sizing: border-box;
605
- }
606
-
607
- .r-dropdown-chevron {
608
- display: block;
609
- margin-left: 6px;
610
- transition: transform 0.3s 0.1s;
611
- box-sizing: border-box;
612
- }
613
-
614
- .r-dropdown-drop {
615
- list-style: none;
616
- position: absolute;
617
- top: 16px;
618
- left: -12px;
619
- visibility: hidden;
620
- pointer-events: none;
621
- opacity: 0;
622
- transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
623
- background-color: var(--r-main-50);
624
- border: 1px solid var(--r-main-100);
625
- border-radius: 8px;
626
- margin: 0;
627
- padding: 2px 6px;
628
- min-width: 120px;
629
- max-width: 180px;
630
- box-sizing: border-box;
631
- }
632
-
633
- .r-dropdown-link {
634
- display: block;
635
- width: 100%;
636
- text-decoration: none;
637
- color: var(--r-main-700);
638
- padding: 4px 8px;
639
- margin-top: 4px;
640
- margin-bottom: 4px;
641
- border-radius: 4px;
642
- transition: background-color 0.2s;
643
- box-sizing: border-box;
644
- }
645
- .r-dropdown-link:hover {
646
- color: var(--r-main-900);
647
- background-color: var(--r-main-100);
648
- }
649
-
650
- .r-dropdown-link._active {
651
- color: var(--r-primary-700);
852
+ .r-header-input:checked ~ .r-header-burger .r-burger-line._bottom {
853
+ transform: translateY(0) rotate(-45deg);
854
+ margin-top: 0;
652
855
  }.r-search-btn {
653
856
  position: relative;
654
857
  border-radius: 6px;
@@ -832,367 +1035,176 @@
832
1035
  font-size: 14px;
833
1036
  color: var(--r-main-600);
834
1037
  margin: 12px 0 0;
835
- }.r-header-social {
836
- display: flex;
837
- flex: 1;
838
- justify-content: flex-end;
839
- }
840
- @media screen and (width >= 1024px) {
841
- .r-header-social {
842
- flex: none;
843
- justify-content: unset;
844
- }
845
- }
846
-
847
- .r-header-social-git {
848
- color: var(--r-main-700);
849
- transition: color 0.2s;
850
- }
851
- .r-header-social-git:hover, .r-header-social-git:focus {
852
- color: var(--r-main-950);
853
- }.r-article {
854
- padding: 20px 0 40px;
855
- grid-area: content;
856
- }
857
- @media screen and (width >= 1180px) {
858
- .r-article {
859
- padding: 32px 0 40px;
860
- }
861
- }
862
- .r-article > *:first-child {
863
- margin-top: 0;
864
- }
865
- .r-article > *:last-child {
866
- margin-bottom: 0;
867
- }
868
-
869
- .r-checkbox {
870
- cursor: pointer;
871
- width: 20px;
872
- height: 20px;
873
- margin: 4px;
874
- vertical-align: middle;
875
- box-sizing: border-box;
876
- }
877
-
878
- .r-label {
879
- cursor: pointer;
880
- }
881
-
882
- .r-task-ol,
883
- .r-task-ul {
884
- list-style: none;
885
- }
886
-
887
- .r-task-label {
888
- display: block;
889
- width: 100%;
890
- padding-top: 2px;
891
- padding-bottom: 2px;
892
- box-sizing: border-box;
893
- }
894
- .r-task-label:hover .r-checkbox {
895
- filter: brightness(0.8);
896
- }
897
-
898
- .r-task-li.r-task-li {
899
- margin-block-start: 2px;
900
- margin-block-end: 2px;
901
- }
902
-
903
- .r-label-text {
904
- vertical-align: middle;
905
- }.r-sidebar {
906
- grid-area: sidebar;
907
- box-sizing: border-box;
908
- }
909
- @media screen and (width < 768px) {
910
- .r-sidebar {
911
- position: sticky;
912
- width: calc(100% + 24px);
913
- top: var(--r-header-height);
914
- left: 0;
915
- margin: 0 -12px;
916
- background-color: var(--r-main-50);
917
- border-bottom: 1px solid var(--r-main-200);
918
- z-index: 10;
919
- opacity: 0.98;
920
- padding: 0;
921
- overflow: auto;
922
- }
923
- }
924
-
925
- .r-sidebar-top-mock {
926
- grid-row-start: 1;
927
- grid-column-start: 1;
928
- }
929
-
930
- @media screen and (width < 768px) {
931
- .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
932
- display: none;
933
- }
934
- }
935
-
936
- .r-sidebar-nav {
937
- box-sizing: border-box;
938
- }
939
- @media screen and (width < 768px) {
940
- .r-sidebar-nav {
941
- overflow: auto;
942
- max-height: calc(100dvh - var(--r-header-height) - 41px);
943
- }
944
- }
945
-
946
- .r-sidebar-drop {
947
- margin-top: -4px;
948
- padding-top: 4px;
949
- }
950
-
951
- .r-sidebar-sublist {
1038
+ }.r-dropdown {
952
1039
  position: relative;
953
- padding-top: 2px;
954
- }
955
- .r-sidebar-sublist:hover::before {
956
- background-color: var(--r-primary-800);
957
- transition-delay: initial;
958
- }
959
-
960
- .r-sidebar-sublist::before {
961
- content: "";
962
- position: absolute;
963
- top: 0;
964
- left: -12px;
965
- right: 0;
966
- height: 2px;
967
- border-bottom-left-radius: 2px;
968
- background-color: var(--r-main-200);
969
- z-index: 1;
970
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
971
- box-sizing: border-box;
972
- }
973
-
974
- .r-sidebar-nav {
975
- padding: 32px 4px 32px 2px;
976
- box-sizing: border-box;
977
- }
978
- @media screen and (width < 768px) {
979
- .r-sidebar-nav {
980
- padding: 12px;
981
- }
1040
+ color: var(--r-main-600);
1041
+ transition: color 0.2s 0.1s;
982
1042
  }
983
- @media screen and (width >= 768px) {
984
- .r-sidebar-nav {
985
- position: sticky;
986
- top: var(--r-header-height);
987
- overflow: auto;
988
- scrollbar-width: thin;
989
- scrollbar-color: var(--r-main-200) transparent;
990
- scrollbar-gutter: stable;
991
- max-height: calc(100dvh - var(--r-header-height));
992
- }
1043
+ .r-dropdown:hover, .r-dropdown:focus-within {
1044
+ color: var(--r-main-950);
993
1045
  }
994
-
995
- .r-sidebar-space {
996
- box-sizing: border-box;
1046
+ .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
1047
+ visibility: visible;
1048
+ pointer-events: all;
1049
+ transform: translateY(20px);
1050
+ opacity: 1;
997
1051
  }
998
- @media screen and (width < 768px) {
999
- .r-sidebar-space {
1000
- display: block;
1001
- height: 40px;
1002
- }
1052
+ .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
1053
+ transform: rotate(180deg);
1003
1054
  }
1004
1055
 
1005
- .r-sidebar-btn {
1006
- position: sticky;
1007
- top: 0;
1056
+ .r-dropdown-summary {
1008
1057
  display: flex;
1058
+ justify-content: space-between;
1059
+ align-items: center;
1009
1060
  width: 100%;
1010
- font-size: 14px;
1061
+ position: relative;
1062
+ color: inherit;
1063
+ cursor: pointer;
1064
+ padding: 10px 4px;
1065
+ font-size: 16px;
1011
1066
  border: 0;
1012
- padding: 12px;
1013
1067
  background: none;
1014
- cursor: pointer;
1015
- color: var(--r-main-800);
1016
- background-color: var(--r-main-50);
1017
1068
  z-index: 1;
1018
1069
  box-sizing: border-box;
1019
1070
  }
1020
- @media screen and (width >= 768px) {
1021
- .r-sidebar-btn {
1022
- display: none;
1023
- }
1024
- }
1025
1071
 
1026
- .r-sidebar-chevron {
1027
- display: inline;
1028
- margin-right: 6px;
1029
- transition: transform 0.2s;
1072
+ .r-dropdown-chevron {
1073
+ display: block;
1074
+ margin-left: 6px;
1075
+ transition: transform 0.3s 0.1s;
1030
1076
  box-sizing: border-box;
1031
1077
  }
1032
1078
 
1033
- .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
1034
- transform: rotate(90deg);
1035
- }
1036
-
1037
- .r-sidebar-list {
1038
- color: var(--r-main-700);
1079
+ .r-dropdown-drop {
1039
1080
  list-style: none;
1040
- padding: 0;
1081
+ position: absolute;
1082
+ top: 16px;
1083
+ left: -12px;
1084
+ visibility: hidden;
1085
+ pointer-events: none;
1086
+ opacity: 0;
1087
+ transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
1088
+ background-color: var(--r-main-50);
1089
+ border: 1px solid var(--r-main-100);
1090
+ border-radius: 8px;
1041
1091
  margin: 0;
1042
- font-size: 14px;
1092
+ padding: 2px 6px;
1093
+ min-width: 120px;
1094
+ max-width: 180px;
1043
1095
  box-sizing: border-box;
1044
1096
  }
1045
1097
 
1046
- .r-sidebar-drop::details-content {
1047
- overflow: hidden;
1048
- transition: content-visibility 0.4s allow-discrete;
1098
+ .r-dropdown-link {
1099
+ display: block;
1100
+ width: 100%;
1101
+ text-decoration: none;
1102
+ color: var(--r-main-700);
1103
+ padding: 4px 8px;
1104
+ margin-top: 4px;
1105
+ margin-bottom: 4px;
1106
+ border-radius: 4px;
1107
+ transition: background-color 0.2s;
1049
1108
  box-sizing: border-box;
1050
1109
  }
1051
-
1052
- .r-sidebar-sublist {
1053
- margin-left: 12px;
1054
- }
1055
-
1056
- .r-sidebar-drop > .r-sidebar-sublist {
1057
- opacity: 0;
1058
- transition: opacity 0.2s ease;
1059
- }
1060
-
1061
- .r-sidebar-drop[open] > .r-sidebar-sublist {
1062
- opacity: 1;
1063
- }
1064
-
1065
- .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
1066
- margin-top: -4rem;
1067
- transition: margin-top 0.3s ease;
1110
+ .r-dropdown-link:hover {
1111
+ color: var(--r-main-900);
1112
+ background-color: var(--r-main-100);
1068
1113
  }
1069
1114
 
1070
- @starting-style {
1071
- .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
1072
- margin-top: -4rem;
1115
+ .r-dropdown-link._active {
1116
+ color: var(--r-primary-700);
1117
+ }.r-header-social {
1118
+ display: flex;
1119
+ flex: 1;
1120
+ justify-content: flex-end;
1121
+ }
1122
+ @media screen and (width >= 1024px) {
1123
+ .r-header-social {
1124
+ flex: none;
1125
+ justify-content: unset;
1073
1126
  }
1074
1127
  }
1075
1128
 
1076
- .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
1077
- margin-top: 0;
1129
+ .r-header-social-git {
1130
+ color: var(--r-main-700);
1131
+ transition: color 0.2s;
1078
1132
  }
1079
-
1080
- .r-sidebar-sublist .r-sidebar-link {
1133
+ .r-header-social-git:hover, .r-header-social-git:focus {
1134
+ color: var(--r-main-950);
1135
+ }.r-container {
1136
+ max-width: 1180px;
1137
+ padding-right: 12px;
1138
+ padding-left: 12px;
1139
+ margin-right: auto;
1140
+ margin-left: auto;
1141
+ box-sizing: border-box;
1142
+ }.r-theme-switcher {
1081
1143
  position: relative;
1082
- border-top-left-radius: 0;
1083
- border-bottom-left-radius: 0;
1144
+ display: flex;
1145
+ gap: 4px;
1146
+ width: 109px;
1147
+ height: 37px;
1148
+ padding: 2px;
1149
+ background-color: var(--r-main-100);
1150
+ border: 1px solid var(--r-main-200);
1151
+ border-radius: 100px;
1084
1152
  box-sizing: border-box;
1085
1153
  }
1086
- .r-sidebar-sublist .r-sidebar-link::before {
1154
+ .r-theme-switcher::before {
1087
1155
  content: "";
1088
1156
  position: absolute;
1089
- left: 0;
1090
- top: -1px;
1091
- width: 1px;
1092
- height: calc(100% + 4px);
1093
- background-color: var(--r-main-200);
1094
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1157
+ display: block;
1158
+ height: 32px;
1159
+ width: 32px;
1160
+ top: 2px;
1161
+ left: 2px;
1162
+ background-color: var(--r-main-50);
1163
+ border: 1px solid var(--r-main-200);
1164
+ border-radius: 100px;
1165
+ transition: left 0.2s;
1095
1166
  box-sizing: border-box;
1096
1167
  }
1097
1168
 
1098
- .r-sidebar-li {
1099
- position: relative;
1100
- line-height: 1.5;
1101
- }
1102
-
1103
- .r-sidebar-li._separator {
1104
- background: var(--r-main-200);
1105
- padding: 1px;
1106
- }
1107
-
1108
- .r-sidebar-li._droppable > a {
1109
- padding-right: 32px;
1110
- }
1111
-
1112
- .r-sidebar-li-d0 {
1113
- margin-left: -8px;
1114
- }
1115
-
1116
- .r-sidebar-p {
1117
- margin: 0;
1118
- padding: 4px 10px;
1119
- }
1120
-
1121
- .r-sidebar-heading {
1122
- color: var(--r-main-900);
1123
- font-weight: 600;
1124
- margin-block-end: 4px;
1125
- }
1126
- .r-sidebar-heading:not(:first-child) {
1127
- margin-block-start: 12px;
1169
+ .r-theme-switcher-btn {
1170
+ padding: 8px;
1171
+ background: none;
1172
+ border: 0;
1173
+ border-radius: 100px;
1174
+ cursor: pointer;
1175
+ color: var(--r-main-700);
1176
+ fill: transparent;
1177
+ z-index: 1;
1178
+ transition: color 0.2s 0.1s, fill 0.2s;
1128
1179
  }
1129
-
1130
- .r-sidebar-link {
1131
- padding: 4px 10px;
1132
- color: inherit;
1133
- border-bottom: 2px solid transparent;
1134
- border-radius: 2px;
1135
- text-decoration: none;
1136
- display: -webkit-box;
1137
- -webkit-box-orient: vertical;
1138
- -webkit-line-clamp: 3;
1139
- overflow: hidden;
1140
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s, color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1180
+ .r-theme-switcher-btn:hover {
1181
+ color: var(--r-main-950);
1182
+ fill: var(--r-main-600);
1141
1183
  }
1142
1184
 
1143
- .r-sidebar-link._target {
1144
- color: var(--r-primary-950);
1145
- background-color: var(--r-main-50);
1185
+ .r-theme-dark:not(.r-theme-system) .r-theme-switcher::before {
1186
+ left: 2px;
1146
1187
  }
1147
1188
 
1148
- .r-sidebar-link:hover {
1149
- color: var(--r-primary-800);
1150
- background-color: var(--r-main-100);
1151
- transition-delay: initial;
1152
- }
1153
- .r-sidebar-link:hover::before {
1154
- background-color: currentColor;
1155
- transition-delay: initial;
1189
+ .r-theme-dark:not(.r-theme-system) .r-theme-switcher-btn__dark,
1190
+ .r-theme-system .r-theme-switcher-btn__system,
1191
+ .r-theme-light:not(.r-theme-system) .r-theme-switcher-btn__light {
1192
+ color: var(--r-main-950);
1193
+ fill: var(--r-main-950);
1194
+ pointer-events: none;
1156
1195
  }
1157
1196
 
1158
- .r-sidebar-link._active {
1159
- color: var(--r-primary-700);
1160
- background-color: var(--r-main-50);
1161
- }
1162
- .r-sidebar-link._active::before {
1163
- background-color: currentColor;
1197
+ .r-theme-switcher::before,
1198
+ .r-theme-system .r-theme-switcher::before {
1199
+ left: 38px;
1164
1200
  }
1165
1201
 
1166
- .r-sidebar-drop-btn {
1167
- position: absolute;
1168
- right: 3px;
1169
- top: 5px;
1170
- border-radius: 4px;
1171
- padding: 4px;
1172
- list-style: none;
1173
- cursor: pointer;
1174
- transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1175
- }
1176
- .r-sidebar-drop-btn:hover {
1177
- color: var(--r-primary-500);
1178
- transition-delay: initial;
1179
- }
1180
- .r-sidebar-drop-btn::before {
1181
- content: "";
1182
- position: absolute;
1183
- inset: -4px;
1184
- }
1185
- .r-sidebar-drop-btn::-webkit-details-marker {
1186
- display: none;
1202
+ .r-theme-light:not(.r-theme-system) .r-theme-switcher::before {
1203
+ left: 74px;
1187
1204
  }
1188
1205
 
1189
- .r-sidebar-drop-icon {
1206
+ .r-theme-switcher-svg {
1190
1207
  display: block;
1191
- transition: transform 0.2s;
1192
- }
1193
-
1194
- .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
1195
- transform: rotate(90deg);
1196
1208
  }.r-keylink {
1197
1209
  display: block;
1198
1210
  position: relative;
@@ -1213,55 +1225,119 @@
1213
1225
  user-select: none;
1214
1226
  pointer-events: none;
1215
1227
  box-sizing: border-box;
1216
- }.r-backdrop {
1217
- position: fixed;
1218
- top: 0;
1219
- right: 0;
1220
- bottom: 0;
1221
- left: 0;
1222
- opacity: 0;
1223
- visibility: hidden;
1224
- pointer-events: none;
1225
- z-index: 100;
1228
+ }.r-breadcrumbs {
1229
+ grid-area: breadcrumbs;
1230
+ list-style: none;
1231
+ margin: 0;
1232
+ padding: 20px 0 0;
1233
+ line-height: 2;
1234
+ }
1235
+ @media screen and (width >= 768px) {
1236
+ .r-breadcrumbs {
1237
+ padding: 32px 0 0;
1238
+ }
1239
+ }
1240
+
1241
+ .r-breadcrumb {
1242
+ display: inline;
1243
+ }
1244
+
1245
+ .r-breadcrumb._previous::after {
1246
+ content: "/";
1247
+ font-weight: 600;
1248
+ margin-inline: 8px;
1249
+ }
1250
+
1251
+ .r-breadcrumb-link {
1252
+ color: var(--r-main-700);
1253
+ text-decoration: none;
1254
+ }
1255
+ .r-breadcrumb-link:hover {
1256
+ color: var(--r-primary-800);
1257
+ }
1258
+
1259
+ .r-breadcrumb-link,
1260
+ .r-breadcrumb-title {
1261
+ display: inline;
1262
+ padding: 6px 0;
1263
+ margin: 0;
1264
+ }
1265
+
1266
+ .r-breadcrumb-title {
1267
+ color: var(--r-main-950);
1268
+ font-weight: 600;
1269
+ }.r-pagination {
1270
+ grid-area: pagination;
1271
+ display: grid;
1272
+ grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1273
+ gap: 16px;
1274
+ margin-bottom: 40px;
1275
+ }
1276
+
1277
+ .r-pagination-item {
1278
+ position: relative;
1279
+ padding-top: 8px;
1280
+ padding-bottom: 8px;
1281
+ text-decoration: none;
1282
+ font-size: 14px;
1283
+ color: var(--r-main-800);
1284
+ }
1285
+ .r-pagination-item:hover {
1286
+ color: var(--r-main-950);
1287
+ }
1288
+
1289
+ .r-pagination-item._prev {
1290
+ padding-left: 28px;
1291
+ }
1292
+
1293
+ .r-pagination-item._next {
1294
+ text-align: right;
1295
+ padding-right: 28px;
1226
1296
  }
1227
1297
 
1228
- .r-backdrop._visible {
1229
- opacity: 1;
1230
- visibility: visible;
1231
- pointer-events: all;
1232
- }.r-git-logo {
1298
+ .r-pagination-text {
1233
1299
  display: block;
1234
- }.r-external-mark {
1235
- position: relative;
1236
- vertical-align: text-top;
1237
- display: inline-block;
1238
- margin-left: -4px;
1239
- margin-right: 2px;
1240
- width: 6px;
1241
- height: 6px;
1242
- box-sizing: border-box;
1300
+ line-height: 2;
1243
1301
  }
1244
- .r-external-mark::after {
1245
- content: "";
1246
- position: absolute;
1247
- top: 0;
1248
- right: 0;
1249
- width: 100%;
1250
- height: 100%;
1251
- border-top: 1px solid currentColor;
1252
- border-right: 1px solid currentColor;
1253
- box-sizing: border-box;
1302
+
1303
+ .r-pagination-title {
1304
+ font-weight: 600;
1305
+ font-size: 16px;
1254
1306
  }
1255
- .r-external-mark::before {
1256
- content: "";
1307
+
1308
+ .r-pagination-icon {
1257
1309
  position: absolute;
1258
- top: 0;
1310
+ top: 50%;
1311
+ transform: translateY(-50%);
1312
+ transition: transform 0.2s;
1313
+ }
1314
+
1315
+ .r-pagination-icon._prev {
1316
+ left: 0;
1317
+ }
1318
+ .r-pagination-item:hover .r-pagination-icon._prev {
1319
+ transform: translate(-4px, -50%);
1320
+ }
1321
+ @media screen and (width >= 1180px) {
1322
+ .r-pagination-item:hover .r-pagination-icon._prev {
1323
+ transform: translate(-8px, -50%);
1324
+ }
1325
+ }
1326
+
1327
+ .r-pagination-icon._next {
1259
1328
  right: 0;
1260
- width: 3px;
1261
- height: 3px;
1262
- background-color: currentColor;
1263
- border-radius: 0 0 0 4px;
1264
- box-sizing: border-box;
1329
+ }
1330
+ .r-pagination-item:hover .r-pagination-icon._next {
1331
+ transform: translate(4px, -50%);
1332
+ }
1333
+ @media screen and (width >= 1180px) {
1334
+ .r-pagination-item:hover .r-pagination-icon._next {
1335
+ transform: translate(8px, -50%);
1336
+ }
1337
+ }
1338
+
1339
+ .r-pagination-svg {
1340
+ display: block;
1265
1341
  }.r-contents {
1266
1342
  grid-area: contents;
1267
1343
  }
@@ -1501,122 +1577,58 @@
1501
1577
  }
1502
1578
  .r-contents-git:hover {
1503
1579
  color: var(--r-main-900);
1504
- }.r-breadcrumbs {
1505
- grid-area: breadcrumbs;
1506
- list-style: none;
1507
- margin: 0;
1508
- padding: 20px 0 0;
1509
- line-height: 2;
1510
- }
1511
- @media screen and (width >= 768px) {
1512
- .r-breadcrumbs {
1513
- padding: 32px 0 0;
1514
- }
1515
- }
1516
-
1517
- .r-breadcrumb {
1518
- display: inline;
1519
- }
1520
-
1521
- .r-breadcrumb._previous::after {
1522
- content: "/";
1523
- font-weight: 600;
1524
- margin-inline: 8px;
1525
- }
1526
-
1527
- .r-breadcrumb-link {
1528
- color: var(--r-main-700);
1529
- text-decoration: none;
1530
- }
1531
- .r-breadcrumb-link:hover {
1532
- color: var(--r-primary-800);
1533
- }
1534
-
1535
- .r-breadcrumb-link,
1536
- .r-breadcrumb-title {
1537
- display: inline;
1538
- padding: 6px 0;
1539
- margin: 0;
1540
- }
1541
-
1542
- .r-breadcrumb-title {
1543
- color: var(--r-main-950);
1544
- font-weight: 600;
1545
1580
  }.r-last-modified {
1546
1581
  color: var(--r-main-700);
1547
1582
  margin-block-start: 16px;
1548
- }.r-pagination {
1549
- grid-area: pagination;
1550
- display: grid;
1551
- grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1552
- gap: 16px;
1553
- margin-bottom: 40px;
1554
- }
1555
-
1556
- .r-pagination-item {
1557
- position: relative;
1558
- padding-top: 8px;
1559
- padding-bottom: 8px;
1560
- text-decoration: none;
1561
- font-size: 14px;
1562
- color: var(--r-main-800);
1563
- }
1564
- .r-pagination-item:hover {
1565
- color: var(--r-main-950);
1566
- }
1567
-
1568
- .r-pagination-item._prev {
1569
- padding-left: 28px;
1570
- }
1571
-
1572
- .r-pagination-item._next {
1573
- text-align: right;
1574
- padding-right: 28px;
1583
+ }.r-backdrop {
1584
+ position: fixed;
1585
+ top: 0;
1586
+ right: 0;
1587
+ bottom: 0;
1588
+ left: 0;
1589
+ opacity: 0;
1590
+ visibility: hidden;
1591
+ pointer-events: none;
1592
+ z-index: 100;
1575
1593
  }
1576
1594
 
1577
- .r-pagination-text {
1595
+ .r-backdrop._visible {
1596
+ opacity: 1;
1597
+ visibility: visible;
1598
+ pointer-events: all;
1599
+ }.r-git-logo {
1578
1600
  display: block;
1579
- line-height: 2;
1580
- }
1581
-
1582
- .r-pagination-title {
1583
- font-weight: 600;
1584
- font-size: 16px;
1601
+ }.r-external-mark {
1602
+ position: relative;
1603
+ vertical-align: text-top;
1604
+ display: inline-block;
1605
+ margin-left: -4px;
1606
+ margin-right: 2px;
1607
+ width: 6px;
1608
+ height: 6px;
1609
+ box-sizing: border-box;
1585
1610
  }
1586
-
1587
- .r-pagination-icon {
1611
+ .r-external-mark::after {
1612
+ content: "";
1588
1613
  position: absolute;
1589
- top: 50%;
1590
- transform: translateY(-50%);
1591
- transition: transform 0.2s;
1592
- }
1593
-
1594
- .r-pagination-icon._prev {
1595
- left: 0;
1596
- }
1597
- .r-pagination-item:hover .r-pagination-icon._prev {
1598
- transform: translate(-4px, -50%);
1599
- }
1600
- @media screen and (width >= 1180px) {
1601
- .r-pagination-item:hover .r-pagination-icon._prev {
1602
- transform: translate(-8px, -50%);
1603
- }
1604
- }
1605
-
1606
- .r-pagination-icon._next {
1614
+ top: 0;
1607
1615
  right: 0;
1616
+ width: 100%;
1617
+ height: 100%;
1618
+ border-top: 1px solid currentColor;
1619
+ border-right: 1px solid currentColor;
1620
+ box-sizing: border-box;
1608
1621
  }
1609
- .r-pagination-item:hover .r-pagination-icon._next {
1610
- transform: translate(4px, -50%);
1611
- }
1612
- @media screen and (width >= 1180px) {
1613
- .r-pagination-item:hover .r-pagination-icon._next {
1614
- transform: translate(8px, -50%);
1615
- }
1616
- }
1617
-
1618
- .r-pagination-svg {
1619
- display: block;
1622
+ .r-external-mark::before {
1623
+ content: "";
1624
+ position: absolute;
1625
+ top: 0;
1626
+ right: 0;
1627
+ width: 3px;
1628
+ height: 3px;
1629
+ background-color: currentColor;
1630
+ border-radius: 0 0 0 4px;
1631
+ box-sizing: border-box;
1620
1632
  }.r-kbd-container {
1621
1633
  display: flex;
1622
1634
  gap: 4px;
@@ -1704,6 +1716,7 @@
1704
1716
  .r-code-section-filename {
1705
1717
  font-family: var(--monospace-font, monospace, monospace);
1706
1718
  }.r-block {
1719
+ position: relative;
1707
1720
  width: 100%;
1708
1721
  overflow: auto;
1709
1722
  margin-block-start: 12px;
@@ -1711,6 +1724,7 @@
1711
1724
  scrollbar-width: thin;
1712
1725
  scrollbar-color: var(--r-main-200) transparent;
1713
1726
  box-sizing: border-box;
1727
+ z-index: 1;
1714
1728
  }.r-blockquote {
1715
1729
  padding: 4px 12px 4px 20px;
1716
1730
  border: 4px solid var(--r-main-100);
@@ -2040,24 +2054,6 @@
2040
2054
  z-index: -1;
2041
2055
  border-radius: 8px;
2042
2056
  border: 1px solid var(--r-main-200);
2043
- }.r-td {
2044
- padding: 8px 12px;
2045
- border-collapse: collapse;
2046
- }
2047
- .r-td:not(:last-child) {
2048
- border-right: 1px solid var(--r-main-200);
2049
- }
2050
-
2051
- .r-td_left {
2052
- text-align: left;
2053
- }
2054
-
2055
- .r-td_center {
2056
- text-align: center;
2057
- }
2058
-
2059
- .r-td_right {
2060
- text-align: right;
2061
2057
  }.r-th {
2062
2058
  padding: 8px 12px;
2063
2059
  border-collapse: collapse;
@@ -2084,6 +2080,24 @@
2084
2080
 
2085
2081
  .r-th_right {
2086
2082
  text-align: right;
2083
+ }.r-td {
2084
+ padding: 8px 12px;
2085
+ border-collapse: collapse;
2086
+ }
2087
+ .r-td:not(:last-child) {
2088
+ border-right: 1px solid var(--r-main-200);
2089
+ }
2090
+
2091
+ .r-td_left {
2092
+ text-align: left;
2093
+ }
2094
+
2095
+ .r-td_center {
2096
+ text-align: center;
2097
+ }
2098
+
2099
+ .r-td_right {
2100
+ text-align: right;
2087
2101
  }.r-tr {
2088
2102
  border-collapse: collapse;
2089
2103
  }