robindoc 3.7.6 → 3.7.7

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 +745 -745
  2. package/package.json +1 -1
package/lib/styles.css CHANGED
@@ -11,6 +11,20 @@
11
11
  scrollbar-width: thin;
12
12
  scrollbar-color: var(--r-main-200) transparent;
13
13
  box-sizing: border-box;
14
+ }.r-code-span {
15
+ font-family: var(--monospace-font, monospace, monospace);
16
+ background-color: var(--r-main-100);
17
+ border: 1px solid var(--r-main-200);
18
+ color: var(--r-main-950);
19
+ border-radius: 4px;
20
+ padding: 2px 6px;
21
+ font-size: inherit;
22
+ font-weight: 500;
23
+ letter-spacing: 0.5px;
24
+ }
25
+
26
+ .r-code-span + .r-content-link-external {
27
+ margin-left: -12px;
14
28
  }.r-header {
15
29
  position: sticky;
16
30
  background-color: var(--r-main-50);
@@ -111,6 +125,49 @@
111
125
  width: 100%;
112
126
  left: 0;
113
127
  }
128
+ }.r-footer {
129
+ border-top: 1px solid var(--r-main-300);
130
+ }
131
+
132
+ .r-footer-container.r-footer-container {
133
+ padding: 16px 12px;
134
+ }
135
+ @media screen and (width >= 1024px) {
136
+ .r-footer-container.r-footer-container {
137
+ padding-left: 24px;
138
+ padding-right: 24px;
139
+ }
140
+ }
141
+
142
+ .r-footer-row {
143
+ display: flex;
144
+ justify-content: space-between;
145
+ align-items: center;
146
+ gap: 32px;
147
+ }
148
+
149
+ .r-footer-additional {
150
+ margin-top: 20px;
151
+ justify-content: flex-end;
152
+ }
153
+
154
+ .r-copyright {
155
+ color: var(--r-main-800);
156
+ }
157
+
158
+ .r-powered {
159
+ font-size: 14px;
160
+ display: block;
161
+ color: var(--r-main-600);
162
+ }
163
+
164
+ .r-powered-link {
165
+ font-weight: 600;
166
+ text-decoration: none;
167
+ color: var(--r-main-950);
168
+ }
169
+ .r-powered-link:hover {
170
+ color: var(--r-primary-900);
114
171
  }.r-root {
115
172
  --r-header-height: 60px;
116
173
  position: relative;
@@ -344,49 +401,6 @@
344
401
  --r-cl-60: #86181d;
345
402
  --r-cl-61: #144620;
346
403
  --r-cl-62: #c24e00;
347
- }.r-footer {
348
- border-top: 1px solid var(--r-main-300);
349
- }
350
-
351
- .r-footer-container.r-footer-container {
352
- padding: 16px 12px;
353
- }
354
- @media screen and (width >= 1024px) {
355
- .r-footer-container.r-footer-container {
356
- padding-left: 24px;
357
- padding-right: 24px;
358
- }
359
- }
360
-
361
- .r-footer-row {
362
- display: flex;
363
- justify-content: space-between;
364
- align-items: center;
365
- gap: 32px;
366
- }
367
-
368
- .r-footer-additional {
369
- margin-top: 20px;
370
- justify-content: flex-end;
371
- }
372
-
373
- .r-copyright {
374
- color: var(--r-main-800);
375
- }
376
-
377
- .r-powered {
378
- font-size: 14px;
379
- display: block;
380
- color: var(--r-main-600);
381
- }
382
-
383
- .r-powered-link {
384
- font-weight: 600;
385
- text-decoration: none;
386
- color: var(--r-main-950);
387
- }
388
- .r-powered-link:hover {
389
- color: var(--r-primary-900);
390
404
  }.r-docs-container {
391
405
  min-height: calc(100dvh - var(--r-header-height));
392
406
  overflow-wrap: break-word;
@@ -434,738 +448,724 @@
434
448
  z-index: 1001;
435
449
  }.r-keylink.keylink-to-navigation:focus {
436
450
  margin-top: -40px;
437
- }.r-code-span {
438
- font-family: var(--monospace-font, monospace, monospace);
439
- background-color: var(--r-main-100);
440
- border: 1px solid var(--r-main-200);
441
- color: var(--r-main-950);
442
- border-radius: 4px;
443
- padding: 2px 6px;
444
- font-size: inherit;
445
- font-weight: 500;
446
- letter-spacing: 0.5px;
451
+ }.r-article {
452
+ padding: 20px 0 40px;
453
+ grid-area: content;
454
+ }
455
+ @media screen and (width >= 1180px) {
456
+ .r-article {
457
+ padding: 32px 0 40px;
458
+ }
459
+ }
460
+ .r-article > *:first-child {
461
+ margin-top: 0;
462
+ }
463
+ .r-article > *:last-child {
464
+ margin-bottom: 0;
447
465
  }
448
466
 
449
- .r-code-span + .r-content-link-external {
450
- margin-left: -12px;
451
- }.r-header-menu {
452
- display: flex;
453
- justify-content: flex-end;
454
- order: 1;
467
+ .r-checkbox {
468
+ cursor: pointer;
469
+ width: 20px;
470
+ height: 20px;
471
+ margin: 4px;
472
+ vertical-align: middle;
473
+ box-sizing: border-box;
455
474
  }
456
- @media screen and (width >= 1024px) {
457
- .r-header-menu {
458
- flex: 1;
459
- order: unset;
460
- }
475
+
476
+ .r-label {
477
+ cursor: pointer;
461
478
  }
462
479
 
463
- .r-header-input:checked ~ .r-header-burger ~ .r-header-responsive {
464
- display: flex;
480
+ .r-task-ol,
481
+ .r-task-ul {
482
+ list-style: none;
465
483
  }
466
484
 
467
- .r-header-responsive {
468
- display: none;
469
- justify-content: flex-end;
470
- flex: 1;
471
- gap: 24px;
472
- z-index: 1;
485
+ .r-task-label {
486
+ display: block;
487
+ width: 100%;
488
+ padding-top: 2px;
489
+ padding-bottom: 2px;
490
+ box-sizing: border-box;
473
491
  }
474
- @media screen and (width < 1024px) {
475
- .r-header-responsive {
476
- flex-direction: column-reverse;
477
- padding: 12px;
478
- background-color: var(--r-main-50);
479
- position: fixed;
480
- top: 60px;
481
- right: 0;
482
- bottom: 0;
483
- left: 0;
484
- }
492
+ .r-task-label:hover .r-checkbox {
493
+ filter: brightness(0.8);
485
494
  }
486
- @media screen and (width >= 1024px) {
487
- .r-header-responsive {
488
- display: flex;
489
- justify-content: space-between;
490
- align-items: center;
491
- }
495
+
496
+ .r-task-li.r-task-li {
497
+ margin-block-start: 2px;
498
+ margin-block-end: 2px;
492
499
  }
493
500
 
494
- .r-header-burger {
495
- position: relative;
496
- display: flex;
497
- align-items: center;
498
- justify-content: center;
499
- height: 32px;
500
- width: 32px;
501
- cursor: pointer;
502
- background: none;
503
- border: none;
501
+ .r-label-text {
502
+ vertical-align: middle;
503
+ }.r-sidebar {
504
+ grid-area: sidebar;
504
505
  box-sizing: border-box;
505
506
  }
506
- @media screen and (width >= 1024px) {
507
- .r-header-burger {
508
- display: none;
507
+ @media screen and (width < 768px) {
508
+ .r-sidebar {
509
+ position: sticky;
510
+ width: calc(100% + 24px);
511
+ top: var(--r-header-height);
512
+ left: 0;
513
+ margin: 0 -12px;
514
+ background-color: var(--r-main-50);
515
+ border-bottom: 1px solid var(--r-main-200);
516
+ z-index: 10;
517
+ opacity: 0.98;
518
+ padding: 0;
519
+ overflow: auto;
509
520
  }
510
521
  }
511
522
 
512
- .r-burger-line {
513
- display: block;
514
- width: 20px;
515
- height: 1.5px;
516
- position: absolute;
517
- background-color: var(--r-main-700);
518
- margin: auto;
519
- transition: transform 0.3s;
520
- box-sizing: border-box;
523
+ .r-sidebar-top-mock {
524
+ grid-row-start: 1;
525
+ grid-column-start: 1;
521
526
  }
522
527
 
523
- .r-burger-line._top {
524
- transform: translateY(-3px);
528
+ @media screen and (width < 768px) {
529
+ .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
530
+ display: none;
531
+ }
525
532
  }
526
533
 
527
- .r-header-input:checked ~ .r-header-burger .r-burger-line._top {
528
- transform: translateY(0) rotate(45deg);
529
- margin-top: 0;
534
+ .r-sidebar-nav {
535
+ box-sizing: border-box;
536
+ }
537
+ @media screen and (width < 768px) {
538
+ .r-sidebar-nav {
539
+ overflow: auto;
540
+ max-height: calc(100dvh - var(--r-header-height) - 41px);
541
+ }
530
542
  }
531
543
 
532
- .r-burger-line._bottom {
533
- transform: translateY(3px);
544
+ .r-sidebar-drop {
545
+ margin-top: -4px;
546
+ padding-top: 4px;
534
547
  }
535
548
 
536
- .r-header-input:checked ~ .r-header-burger .r-burger-line._bottom {
537
- transform: translateY(0) rotate(-45deg);
538
- margin-top: 0;
539
- }.r-dropdown {
549
+ .r-sidebar-sublist {
540
550
  position: relative;
541
- color: var(--r-main-600);
542
- transition: color 0.2s 0.1s;
543
- }
544
- .r-dropdown:hover, .r-dropdown:focus-within {
545
- color: var(--r-main-950);
546
- }
547
- .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
548
- visibility: visible;
549
- pointer-events: all;
550
- transform: translateY(20px);
551
- opacity: 1;
552
- }
553
- .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
554
- transform: rotate(180deg);
555
- }
556
-
557
- .r-dropdown-summary {
558
- display: flex;
559
- justify-content: space-between;
560
- align-items: center;
561
- width: 100%;
562
- position: relative;
563
- color: inherit;
564
- cursor: pointer;
565
- padding: 10px 4px;
566
- font-size: 16px;
567
- border: 0;
568
- background: none;
569
- z-index: 1;
570
- box-sizing: border-box;
551
+ padding-top: 2px;
571
552
  }
572
-
573
- .r-dropdown-chevron {
574
- display: block;
575
- margin-left: 6px;
576
- transition: transform 0.3s 0.1s;
577
- box-sizing: border-box;
553
+ .r-sidebar-sublist:hover::before {
554
+ background-color: var(--r-primary-800);
555
+ transition-delay: initial;
578
556
  }
579
557
 
580
- .r-dropdown-drop {
581
- list-style: none;
558
+ .r-sidebar-sublist::before {
559
+ content: "";
582
560
  position: absolute;
583
- top: 16px;
561
+ top: 0;
584
562
  left: -12px;
585
- visibility: hidden;
586
- pointer-events: none;
587
- opacity: 0;
588
- transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
589
- background-color: var(--r-main-50);
590
- border: 1px solid var(--r-main-100);
591
- border-radius: 8px;
592
- margin: 0;
593
- padding: 2px 6px;
594
- min-width: 120px;
595
- max-width: 180px;
563
+ right: 0;
564
+ height: 2px;
565
+ border-bottom-left-radius: 2px;
566
+ background-color: var(--r-main-200);
567
+ z-index: 1;
568
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
596
569
  box-sizing: border-box;
597
570
  }
598
571
 
599
- .r-dropdown-link {
600
- display: block;
601
- width: 100%;
602
- text-decoration: none;
603
- color: var(--r-main-700);
604
- padding: 4px 8px;
605
- margin-top: 4px;
606
- margin-bottom: 4px;
607
- border-radius: 4px;
608
- transition: background-color 0.2s;
572
+ .r-sidebar-nav {
573
+ padding: 32px 4px 32px 2px;
609
574
  box-sizing: border-box;
610
575
  }
611
- .r-dropdown-link:hover {
612
- color: var(--r-main-900);
613
- background-color: var(--r-main-100);
576
+ @media screen and (width < 768px) {
577
+ .r-sidebar-nav {
578
+ padding: 12px;
579
+ }
580
+ }
581
+ @media screen and (width >= 768px) {
582
+ .r-sidebar-nav {
583
+ position: sticky;
584
+ top: var(--r-header-height);
585
+ overflow: auto;
586
+ scrollbar-width: thin;
587
+ scrollbar-color: var(--r-main-200) transparent;
588
+ scrollbar-gutter: stable;
589
+ max-height: calc(100dvh - var(--r-header-height));
590
+ }
614
591
  }
615
592
 
616
- .r-dropdown-link._active {
617
- color: var(--r-primary-700);
618
- }.r-header-social {
619
- display: flex;
620
- flex: 1;
621
- justify-content: flex-end;
593
+ .r-sidebar-space {
594
+ box-sizing: border-box;
622
595
  }
623
- @media screen and (width >= 1024px) {
624
- .r-header-social {
625
- flex: none;
626
- justify-content: unset;
596
+ @media screen and (width < 768px) {
597
+ .r-sidebar-space {
598
+ display: block;
599
+ height: 40px;
627
600
  }
628
601
  }
629
602
 
630
- .r-header-social-git {
631
- color: var(--r-main-700);
632
- transition: color 0.2s;
633
- }
634
- .r-header-social-git:hover, .r-header-social-git:focus {
635
- color: var(--r-main-950);
636
- }.r-search-btn {
637
- position: relative;
638
- border-radius: 6px;
639
- background-color: var(--r-main-100);
640
- color: var(--r-main-600);
641
- padding: 8px 16px;
642
- border: 1px solid var(--r-main-200);
603
+ .r-sidebar-btn {
604
+ position: sticky;
605
+ top: 0;
606
+ display: flex;
643
607
  width: 100%;
644
- text-align: left;
645
- cursor: text;
608
+ font-size: 14px;
609
+ border: 0;
610
+ padding: 12px;
611
+ background: none;
612
+ cursor: pointer;
613
+ color: var(--r-main-800);
614
+ background-color: var(--r-main-50);
615
+ z-index: 1;
646
616
  box-sizing: border-box;
647
617
  }
648
618
  @media screen and (width >= 768px) {
649
- .r-search-btn {
650
- width: 220px;
651
- padding: 8px 96px 8px 16px;
619
+ .r-sidebar-btn {
620
+ display: none;
652
621
  }
653
622
  }
654
- .r-search-btn:hover {
655
- border-color: var(--r-main-600);
623
+
624
+ .r-sidebar-chevron {
625
+ display: inline;
626
+ margin-right: 6px;
627
+ transition: transform 0.2s;
628
+ box-sizing: border-box;
656
629
  }
657
- .r-search-btn:hover .r-search-kbd {
658
- color: var(--r-main-950);
630
+
631
+ .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
632
+ transform: rotate(90deg);
659
633
  }
660
634
 
661
- .r-search-title {
662
- display: block;
663
- overflow: hidden;
664
- text-overflow: ellipsis;
665
- white-space: nowrap;
635
+ .r-sidebar-list {
636
+ color: var(--r-main-700);
637
+ list-style: none;
638
+ padding: 0;
639
+ margin: 0;
640
+ font-size: 14px;
641
+ box-sizing: border-box;
666
642
  }
667
643
 
668
- .r-search-kbd {
669
- display: none;
670
- position: absolute;
671
- right: 6px;
672
- top: 50%;
673
- transform: translateY(-50%);
644
+ .r-sidebar-drop::details-content {
645
+ overflow: hidden;
646
+ transition: content-visibility 0.4s allow-discrete;
647
+ box-sizing: border-box;
674
648
  }
675
- @media screen and (width >= 768px) {
676
- .r-search-kbd {
677
- display: flex;
678
- }
649
+
650
+ .r-sidebar-sublist {
651
+ margin-left: 12px;
679
652
  }
680
653
 
681
- .r-search-dialog {
682
- width: 100%;
683
- height: 100%;
684
- background: none;
685
- max-width: none;
686
- max-height: none;
687
- border: none;
688
- padding: unset;
689
- transition: opacity 0.3s ease, overlay 0.4s ease-out allow-discrete, display 0.4s ease-out allow-discrete;
654
+ .r-sidebar-drop > .r-sidebar-sublist {
690
655
  opacity: 0;
691
- }
692
- .r-search-dialog::backdrop {
693
- backdrop-filter: blur(0);
694
- background: color-mix(in srgb, var(--r-main-900) 0%, transparent 100%);
695
- transition: backdrop-filter 0.4s ease-out, background 0.4s ease-out;
656
+ transition: opacity 0.2s ease;
696
657
  }
697
658
 
698
- .r-search-dialog[open] {
659
+ .r-sidebar-drop[open] > .r-sidebar-sublist {
699
660
  opacity: 1;
700
661
  }
701
- @starting-style {
702
- .r-search-dialog[open] {
703
- opacity: 0;
704
- }
705
- }
706
- .r-search-dialog[open]::backdrop {
707
- backdrop-filter: blur(4px);
708
- background: color-mix(in srgb, var(--r-main-900) 40%, transparent 100%);
709
- }
710
662
 
711
- .r-search-popup {
712
- position: fixed;
713
- left: 50%;
714
- transform: translateX(-50%);
715
- top: calc(var(--r-header-height) + 20px);
716
- z-index: 200;
717
- width: 100%;
718
- max-width: 540px;
719
- background-color: color-mix(in srgb, var(--r-main-50) 95%, transparent);
720
- border: 2px solid var(--r-main-200);
721
- border-bottom-width: 0;
722
- border-radius: 12px 12px 0 0;
723
- opacity: 0;
724
- transform: translateX(-50%) translateY(-20px);
725
- transition: opacity 0.2s, transform 0.2s;
663
+ .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
664
+ margin-top: -4rem;
665
+ transition: margin-top 0.3s ease;
726
666
  }
727
667
 
728
- .r-search-dialog[open] .r-search-popup {
729
- opacity: 1;
730
- transform: translateX(-50%) translateY(0);
731
- }
732
668
  @starting-style {
733
- .r-search-dialog[open] .r-search-popup {
734
- opacity: 0;
735
- transform: translateX(-50%) translateY(-20px);
669
+ .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
670
+ margin-top: -4rem;
736
671
  }
737
672
  }
738
673
 
739
- .r-search-dialog._active .r-search-popup {
740
- border-radius: 12px;
741
- border-bottom-width: 2px;
742
- }
743
-
744
- .r-search-popup:has(.r-search-input:focus) {
745
- border-color: var(--r-main-300);
674
+ .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
675
+ margin-top: 0;
746
676
  }
747
677
 
748
- .r-search-popup-header {
678
+ .r-sidebar-sublist .r-sidebar-link {
749
679
  position: relative;
750
- border-bottom: 1px solid var(--r-main-200);
751
- }
752
-
753
- .r-search-input {
754
- background: none;
755
- padding: 16px 20px;
756
- border: none;
757
- border-bottom: 2px solid var(--r-main-100);
758
- width: 100%;
759
- font-size: 16px;
680
+ border-top-left-radius: 0;
681
+ border-bottom-left-radius: 0;
760
682
  box-sizing: border-box;
761
683
  }
762
- @media screen and (width >= 768px) {
763
- .r-search-input {
764
- padding: 16px 72px 16px 20px;
765
- }
684
+ .r-sidebar-sublist .r-sidebar-link::before {
685
+ content: "";
686
+ position: absolute;
687
+ left: 0;
688
+ top: -1px;
689
+ width: 1px;
690
+ height: calc(100% + 4px);
691
+ background-color: var(--r-main-200);
692
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
693
+ box-sizing: border-box;
766
694
  }
767
- .r-search-input:hover {
768
- border-bottom-color: var(--r-main-300);
695
+
696
+ .r-sidebar-li {
697
+ position: relative;
698
+ line-height: 1.5;
769
699
  }
770
- .r-search-input:focus {
771
- outline: none;
772
- border-bottom-color: var(--r-primary-600);
700
+
701
+ .r-sidebar-li._separator {
702
+ background: var(--r-main-200);
703
+ padding: 1px;
773
704
  }
774
- .r-search-input::placeholder {
775
- color: var(--r-main-500);
705
+
706
+ .r-sidebar-li._droppable > a {
707
+ padding-right: 32px;
776
708
  }
777
709
 
778
- .r-search-popup-kbd {
779
- color: var(--r-main-600);
780
- right: 20px;
710
+ .r-sidebar-li-d0 {
711
+ margin-left: -8px;
781
712
  }
782
713
 
783
- .r-search-results {
784
- padding: 2px 8px 8px;
785
- max-height: min(400px, 100dvh - 200px);
786
- overflow-y: auto;
787
- list-style: none;
788
- scrollbar-width: thin;
789
- scrollbar-color: var(--r-main-200) transparent;
714
+ .r-sidebar-p {
790
715
  margin: 0;
791
- box-sizing: border-box;
716
+ padding: 4px 10px;
792
717
  }
793
718
 
794
- .r-search-item {
795
- display: block;
796
- text-decoration: none;
797
- color: var(--r-main-700);
798
- padding: 8px 12px;
799
- border: 1px solid var(--r-main-100);
800
- border-radius: 10px;
801
- width: 100%;
802
- margin-top: 6px;
803
- box-sizing: border-box;
719
+ .r-sidebar-heading {
720
+ color: var(--r-main-900);
721
+ font-weight: 600;
722
+ margin-block-end: 4px;
804
723
  }
805
- .r-search-item:hover, .r-search-item:focus {
806
- color: var(--r-main-950);
807
- background-color: var(--r-main-50);
808
- border-color: var(--r-main-200);
724
+ .r-sidebar-heading:not(:first-child) {
725
+ margin-block-start: 12px;
809
726
  }
810
727
 
811
- .r-search-item-title {
812
- margin: 0;
728
+ .r-sidebar-link {
729
+ padding: 4px 10px;
730
+ color: inherit;
731
+ border-bottom: 2px solid transparent;
732
+ border-radius: 2px;
733
+ text-decoration: none;
734
+ display: -webkit-box;
735
+ -webkit-box-orient: vertical;
736
+ -webkit-line-clamp: 3;
737
+ overflow: hidden;
738
+ 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;
813
739
  }
814
740
 
815
- .r-search-item-desc {
816
- font-size: 14px;
817
- color: var(--r-main-600);
818
- margin: 12px 0 0;
819
- }.r-container {
820
- max-width: 1180px;
821
- padding-right: 12px;
822
- padding-left: 12px;
823
- margin-right: auto;
824
- margin-left: auto;
825
- box-sizing: border-box;
826
- }.r-article {
827
- padding: 20px 0 40px;
828
- grid-area: content;
829
- }
830
- @media screen and (width >= 1180px) {
831
- .r-article {
832
- padding: 32px 0 40px;
833
- }
741
+ .r-sidebar-link._target {
742
+ color: var(--r-primary-950);
743
+ background-color: var(--r-main-50);
834
744
  }
835
- .r-article > *:first-child {
836
- margin-top: 0;
745
+
746
+ .r-sidebar-link:hover {
747
+ color: var(--r-primary-800);
748
+ background-color: var(--r-main-100);
749
+ transition-delay: initial;
837
750
  }
838
- .r-article > *:last-child {
839
- margin-bottom: 0;
751
+ .r-sidebar-link:hover::before {
752
+ background-color: currentColor;
753
+ transition-delay: initial;
840
754
  }
841
755
 
842
- .r-checkbox {
843
- cursor: pointer;
844
- width: 20px;
845
- height: 20px;
846
- margin: 4px;
847
- vertical-align: middle;
848
- box-sizing: border-box;
756
+ .r-sidebar-link._active {
757
+ color: var(--r-primary-700);
758
+ background-color: var(--r-main-50);
849
759
  }
850
-
851
- .r-label {
852
- cursor: pointer;
760
+ .r-sidebar-link._active::before {
761
+ background-color: currentColor;
853
762
  }
854
763
 
855
- .r-task-ol,
856
- .r-task-ul {
764
+ .r-sidebar-drop-btn {
765
+ position: absolute;
766
+ right: 3px;
767
+ top: 5px;
768
+ border-radius: 4px;
769
+ padding: 4px;
857
770
  list-style: none;
771
+ cursor: pointer;
772
+ transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
773
+ }
774
+ .r-sidebar-drop-btn:hover {
775
+ color: var(--r-primary-500);
776
+ transition-delay: initial;
777
+ }
778
+ .r-sidebar-drop-btn::before {
779
+ content: "";
780
+ position: absolute;
781
+ inset: -4px;
782
+ }
783
+ .r-sidebar-drop-btn::-webkit-details-marker {
784
+ display: none;
858
785
  }
859
786
 
860
- .r-task-label {
787
+ .r-sidebar-drop-icon {
861
788
  display: block;
862
- width: 100%;
863
- padding-top: 2px;
864
- padding-bottom: 2px;
865
- box-sizing: border-box;
789
+ transition: transform 0.2s;
866
790
  }
867
- .r-task-label:hover .r-checkbox {
868
- filter: brightness(0.8);
791
+
792
+ .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
793
+ transform: rotate(90deg);
794
+ }.r-header-menu {
795
+ display: flex;
796
+ justify-content: flex-end;
797
+ order: 1;
798
+ }
799
+ @media screen and (width >= 1024px) {
800
+ .r-header-menu {
801
+ flex: 1;
802
+ order: unset;
803
+ }
869
804
  }
870
805
 
871
- .r-task-li.r-task-li {
872
- margin-block-start: 2px;
873
- margin-block-end: 2px;
806
+ .r-header-input:checked ~ .r-header-burger ~ .r-header-responsive {
807
+ display: flex;
874
808
  }
875
809
 
876
- .r-label-text {
877
- vertical-align: middle;
878
- }.r-sidebar {
879
- grid-area: sidebar;
880
- box-sizing: border-box;
810
+ .r-header-responsive {
811
+ display: none;
812
+ justify-content: flex-end;
813
+ flex: 1;
814
+ gap: 24px;
815
+ z-index: 1;
881
816
  }
882
- @media screen and (width < 768px) {
883
- .r-sidebar {
884
- position: sticky;
885
- width: calc(100% + 24px);
886
- top: var(--r-header-height);
887
- left: 0;
888
- margin: 0 -12px;
817
+ @media screen and (width < 1024px) {
818
+ .r-header-responsive {
819
+ flex-direction: column-reverse;
820
+ padding: 12px;
889
821
  background-color: var(--r-main-50);
890
- border-bottom: 1px solid var(--r-main-200);
891
- z-index: 10;
892
- opacity: 0.98;
893
- padding: 0;
894
- overflow: auto;
822
+ position: fixed;
823
+ top: 60px;
824
+ right: 0;
825
+ bottom: 0;
826
+ left: 0;
895
827
  }
896
828
  }
897
-
898
- .r-sidebar-top-mock {
899
- grid-row-start: 1;
900
- grid-column-start: 1;
901
- }
902
-
903
- @media screen and (width < 768px) {
904
- .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
905
- display: none;
829
+ @media screen and (width >= 1024px) {
830
+ .r-header-responsive {
831
+ display: flex;
832
+ justify-content: space-between;
833
+ align-items: center;
906
834
  }
907
835
  }
908
836
 
909
- .r-sidebar-nav {
837
+ .r-header-burger {
838
+ position: relative;
839
+ display: flex;
840
+ align-items: center;
841
+ justify-content: center;
842
+ height: 32px;
843
+ width: 32px;
844
+ cursor: pointer;
845
+ background: none;
846
+ border: none;
910
847
  box-sizing: border-box;
911
848
  }
912
- @media screen and (width < 768px) {
913
- .r-sidebar-nav {
914
- overflow: auto;
915
- max-height: calc(100dvh - var(--r-header-height) - 41px);
849
+ @media screen and (width >= 1024px) {
850
+ .r-header-burger {
851
+ display: none;
916
852
  }
917
853
  }
918
854
 
919
- .r-sidebar-drop {
920
- margin-top: -4px;
921
- padding-top: 4px;
855
+ .r-burger-line {
856
+ display: block;
857
+ width: 20px;
858
+ height: 1.5px;
859
+ position: absolute;
860
+ background-color: var(--r-main-700);
861
+ margin: auto;
862
+ transition: transform 0.3s;
863
+ box-sizing: border-box;
922
864
  }
923
865
 
924
- .r-sidebar-sublist {
925
- position: relative;
926
- padding-top: 2px;
866
+ .r-burger-line._top {
867
+ transform: translateY(-3px);
927
868
  }
928
- .r-sidebar-sublist:hover::before {
929
- background-color: var(--r-primary-800);
930
- transition-delay: initial;
869
+
870
+ .r-header-input:checked ~ .r-header-burger .r-burger-line._top {
871
+ transform: translateY(0) rotate(45deg);
872
+ margin-top: 0;
931
873
  }
932
874
 
933
- .r-sidebar-sublist::before {
934
- content: "";
935
- position: absolute;
936
- top: 0;
937
- left: -12px;
938
- right: 0;
939
- height: 2px;
940
- border-bottom-left-radius: 2px;
941
- background-color: var(--r-main-200);
942
- z-index: 1;
943
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
944
- box-sizing: border-box;
875
+ .r-burger-line._bottom {
876
+ transform: translateY(3px);
945
877
  }
946
878
 
947
- .r-sidebar-nav {
948
- padding: 32px 4px 32px 2px;
879
+ .r-header-input:checked ~ .r-header-burger .r-burger-line._bottom {
880
+ transform: translateY(0) rotate(-45deg);
881
+ margin-top: 0;
882
+ }.r-search-btn {
883
+ position: relative;
884
+ border-radius: 6px;
885
+ background-color: var(--r-main-100);
886
+ color: var(--r-main-600);
887
+ padding: 8px 16px;
888
+ border: 1px solid var(--r-main-200);
889
+ width: 100%;
890
+ text-align: left;
891
+ cursor: text;
949
892
  box-sizing: border-box;
950
893
  }
951
- @media screen and (width < 768px) {
952
- .r-sidebar-nav {
953
- padding: 12px;
954
- }
955
- }
956
894
  @media screen and (width >= 768px) {
957
- .r-sidebar-nav {
958
- position: sticky;
959
- top: var(--r-header-height);
960
- overflow: auto;
961
- scrollbar-width: thin;
962
- scrollbar-color: var(--r-main-200) transparent;
963
- scrollbar-gutter: stable;
964
- max-height: calc(100dvh - var(--r-header-height));
895
+ .r-search-btn {
896
+ width: 220px;
897
+ padding: 8px 96px 8px 16px;
965
898
  }
966
899
  }
967
-
968
- .r-sidebar-space {
969
- box-sizing: border-box;
900
+ .r-search-btn:hover {
901
+ border-color: var(--r-main-600);
970
902
  }
971
- @media screen and (width < 768px) {
972
- .r-sidebar-space {
973
- display: block;
974
- height: 40px;
975
- }
903
+ .r-search-btn:hover .r-search-kbd {
904
+ color: var(--r-main-950);
976
905
  }
977
906
 
978
- .r-sidebar-btn {
979
- position: sticky;
980
- top: 0;
981
- display: flex;
982
- width: 100%;
983
- font-size: 14px;
984
- border: 0;
985
- padding: 12px;
986
- background: none;
987
- cursor: pointer;
988
- color: var(--r-main-800);
989
- background-color: var(--r-main-50);
990
- z-index: 1;
991
- box-sizing: border-box;
907
+ .r-search-title {
908
+ display: block;
909
+ overflow: hidden;
910
+ text-overflow: ellipsis;
911
+ white-space: nowrap;
912
+ }
913
+
914
+ .r-search-kbd {
915
+ display: none;
916
+ position: absolute;
917
+ right: 6px;
918
+ top: 50%;
919
+ transform: translateY(-50%);
992
920
  }
993
921
  @media screen and (width >= 768px) {
994
- .r-sidebar-btn {
995
- display: none;
922
+ .r-search-kbd {
923
+ display: flex;
996
924
  }
997
925
  }
998
926
 
999
- .r-sidebar-chevron {
1000
- display: inline;
1001
- margin-right: 6px;
1002
- transition: transform 0.2s;
1003
- box-sizing: border-box;
927
+ .r-search-dialog {
928
+ width: 100%;
929
+ height: 100%;
930
+ background: none;
931
+ max-width: none;
932
+ max-height: none;
933
+ border: none;
934
+ padding: unset;
935
+ transition: opacity 0.3s ease, overlay 0.4s ease-out allow-discrete, display 0.4s ease-out allow-discrete;
936
+ opacity: 0;
1004
937
  }
1005
-
1006
- .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
1007
- transform: rotate(90deg);
938
+ .r-search-dialog::backdrop {
939
+ backdrop-filter: blur(0);
940
+ background: color-mix(in srgb, var(--r-main-900) 0%, transparent 100%);
941
+ transition: backdrop-filter 0.4s ease-out, background 0.4s ease-out;
1008
942
  }
1009
943
 
1010
- .r-sidebar-list {
1011
- color: var(--r-main-700);
1012
- list-style: none;
1013
- padding: 0;
1014
- margin: 0;
1015
- font-size: 14px;
1016
- box-sizing: border-box;
944
+ .r-search-dialog[open] {
945
+ opacity: 1;
1017
946
  }
1018
-
1019
- .r-sidebar-drop::details-content {
1020
- overflow: hidden;
1021
- transition: content-visibility 0.4s allow-discrete;
1022
- box-sizing: border-box;
947
+ @starting-style {
948
+ .r-search-dialog[open] {
949
+ opacity: 0;
950
+ }
1023
951
  }
1024
-
1025
- .r-sidebar-sublist {
1026
- margin-left: 12px;
952
+ .r-search-dialog[open]::backdrop {
953
+ backdrop-filter: blur(4px);
954
+ background: color-mix(in srgb, var(--r-main-900) 40%, transparent 100%);
1027
955
  }
1028
956
 
1029
- .r-sidebar-drop > .r-sidebar-sublist {
957
+ .r-search-popup {
958
+ position: fixed;
959
+ left: 50%;
960
+ transform: translateX(-50%);
961
+ top: calc(var(--r-header-height) + 20px);
962
+ z-index: 200;
963
+ width: 100%;
964
+ max-width: 540px;
965
+ background-color: color-mix(in srgb, var(--r-main-50) 95%, transparent);
966
+ border: 2px solid var(--r-main-200);
967
+ border-bottom-width: 0;
968
+ border-radius: 12px 12px 0 0;
1030
969
  opacity: 0;
1031
- transition: opacity 0.2s ease;
970
+ transform: translateX(-50%) translateY(-20px);
971
+ transition: opacity 0.2s, transform 0.2s;
1032
972
  }
1033
973
 
1034
- .r-sidebar-drop[open] > .r-sidebar-sublist {
974
+ .r-search-dialog[open] .r-search-popup {
1035
975
  opacity: 1;
976
+ transform: translateX(-50%) translateY(0);
1036
977
  }
1037
-
1038
- .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
1039
- margin-top: -4rem;
1040
- transition: margin-top 0.3s ease;
1041
- }
1042
-
1043
978
  @starting-style {
1044
- .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
1045
- margin-top: -4rem;
979
+ .r-search-dialog[open] .r-search-popup {
980
+ opacity: 0;
981
+ transform: translateX(-50%) translateY(-20px);
1046
982
  }
1047
983
  }
1048
984
 
1049
- .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
1050
- margin-top: 0;
985
+ .r-search-dialog._active .r-search-popup {
986
+ border-radius: 12px;
987
+ border-bottom-width: 2px;
1051
988
  }
1052
989
 
1053
- .r-sidebar-sublist .r-sidebar-link {
990
+ .r-search-popup:has(.r-search-input:focus) {
991
+ border-color: var(--r-main-300);
992
+ }
993
+
994
+ .r-search-popup-header {
1054
995
  position: relative;
1055
- border-top-left-radius: 0;
1056
- border-bottom-left-radius: 0;
996
+ border-bottom: 1px solid var(--r-main-200);
997
+ }
998
+
999
+ .r-search-input {
1000
+ background: none;
1001
+ padding: 16px 20px;
1002
+ border: none;
1003
+ border-bottom: 2px solid var(--r-main-100);
1004
+ width: 100%;
1005
+ font-size: 16px;
1057
1006
  box-sizing: border-box;
1058
1007
  }
1059
- .r-sidebar-sublist .r-sidebar-link::before {
1060
- content: "";
1061
- position: absolute;
1062
- left: 0;
1063
- top: -1px;
1064
- width: 1px;
1065
- height: calc(100% + 4px);
1066
- background-color: var(--r-main-200);
1067
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1068
- box-sizing: border-box;
1008
+ @media screen and (width >= 768px) {
1009
+ .r-search-input {
1010
+ padding: 16px 72px 16px 20px;
1011
+ }
1012
+ }
1013
+ .r-search-input:hover {
1014
+ border-bottom-color: var(--r-main-300);
1015
+ }
1016
+ .r-search-input:focus {
1017
+ outline: none;
1018
+ border-bottom-color: var(--r-primary-600);
1019
+ }
1020
+ .r-search-input::placeholder {
1021
+ color: var(--r-main-500);
1069
1022
  }
1070
1023
 
1071
- .r-sidebar-li {
1072
- position: relative;
1073
- line-height: 1.5;
1024
+ .r-search-popup-kbd {
1025
+ color: var(--r-main-600);
1026
+ right: 20px;
1074
1027
  }
1075
1028
 
1076
- .r-sidebar-li._separator {
1077
- background: var(--r-main-200);
1078
- padding: 1px;
1029
+ .r-search-results {
1030
+ padding: 2px 8px 8px;
1031
+ max-height: min(400px, 100dvh - 200px);
1032
+ overflow-y: auto;
1033
+ list-style: none;
1034
+ scrollbar-width: thin;
1035
+ scrollbar-color: var(--r-main-200) transparent;
1036
+ margin: 0;
1037
+ box-sizing: border-box;
1079
1038
  }
1080
1039
 
1081
- .r-sidebar-li._droppable > a {
1082
- padding-right: 32px;
1040
+ .r-search-item {
1041
+ display: block;
1042
+ text-decoration: none;
1043
+ color: var(--r-main-700);
1044
+ padding: 8px 12px;
1045
+ border: 1px solid var(--r-main-100);
1046
+ border-radius: 10px;
1047
+ width: 100%;
1048
+ margin-top: 6px;
1049
+ box-sizing: border-box;
1083
1050
  }
1084
-
1085
- .r-sidebar-li-d0 {
1086
- margin-left: -8px;
1051
+ .r-search-item:hover, .r-search-item:focus {
1052
+ color: var(--r-main-950);
1053
+ background-color: var(--r-main-50);
1054
+ border-color: var(--r-main-200);
1087
1055
  }
1088
1056
 
1089
- .r-sidebar-p {
1057
+ .r-search-item-title {
1090
1058
  margin: 0;
1091
- padding: 4px 10px;
1092
1059
  }
1093
1060
 
1094
- .r-sidebar-heading {
1095
- color: var(--r-main-900);
1096
- font-weight: 600;
1097
- margin-block-end: 4px;
1061
+ .r-search-item-desc {
1062
+ font-size: 14px;
1063
+ color: var(--r-main-600);
1064
+ margin: 12px 0 0;
1065
+ }.r-dropdown {
1066
+ position: relative;
1067
+ color: var(--r-main-600);
1068
+ transition: color 0.2s 0.1s;
1098
1069
  }
1099
- .r-sidebar-heading:not(:first-child) {
1100
- margin-block-start: 12px;
1070
+ .r-dropdown:hover, .r-dropdown:focus-within {
1071
+ color: var(--r-main-950);
1101
1072
  }
1102
-
1103
- .r-sidebar-link {
1104
- padding: 4px 10px;
1105
- color: inherit;
1106
- border-bottom: 2px solid transparent;
1107
- border-radius: 2px;
1108
- text-decoration: none;
1109
- display: -webkit-box;
1110
- -webkit-box-orient: vertical;
1111
- -webkit-line-clamp: 3;
1112
- overflow: hidden;
1113
- 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;
1073
+ .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
1074
+ visibility: visible;
1075
+ pointer-events: all;
1076
+ transform: translateY(20px);
1077
+ opacity: 1;
1114
1078
  }
1115
-
1116
- .r-sidebar-link._target {
1117
- color: var(--r-primary-950);
1118
- background-color: var(--r-main-50);
1079
+ .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
1080
+ transform: rotate(180deg);
1119
1081
  }
1120
1082
 
1121
- .r-sidebar-link:hover {
1122
- color: var(--r-primary-800);
1123
- background-color: var(--r-main-100);
1124
- transition-delay: initial;
1083
+ .r-dropdown-summary {
1084
+ display: flex;
1085
+ justify-content: space-between;
1086
+ align-items: center;
1087
+ width: 100%;
1088
+ position: relative;
1089
+ color: inherit;
1090
+ cursor: pointer;
1091
+ padding: 10px 4px;
1092
+ font-size: 16px;
1093
+ border: 0;
1094
+ background: none;
1095
+ z-index: 1;
1096
+ box-sizing: border-box;
1125
1097
  }
1126
- .r-sidebar-link:hover::before {
1127
- background-color: currentColor;
1128
- transition-delay: initial;
1098
+
1099
+ .r-dropdown-chevron {
1100
+ display: block;
1101
+ margin-left: 6px;
1102
+ transition: transform 0.3s 0.1s;
1103
+ box-sizing: border-box;
1129
1104
  }
1130
1105
 
1131
- .r-sidebar-link._active {
1132
- color: var(--r-primary-700);
1106
+ .r-dropdown-drop {
1107
+ list-style: none;
1108
+ position: absolute;
1109
+ top: 16px;
1110
+ left: -12px;
1111
+ visibility: hidden;
1112
+ pointer-events: none;
1113
+ opacity: 0;
1114
+ transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
1133
1115
  background-color: var(--r-main-50);
1134
- }
1135
- .r-sidebar-link._active::before {
1136
- background-color: currentColor;
1116
+ border: 1px solid var(--r-main-100);
1117
+ border-radius: 8px;
1118
+ margin: 0;
1119
+ padding: 2px 6px;
1120
+ min-width: 120px;
1121
+ max-width: 180px;
1122
+ box-sizing: border-box;
1137
1123
  }
1138
1124
 
1139
- .r-sidebar-drop-btn {
1140
- position: absolute;
1141
- right: 3px;
1142
- top: 5px;
1125
+ .r-dropdown-link {
1126
+ display: block;
1127
+ width: 100%;
1128
+ text-decoration: none;
1129
+ color: var(--r-main-700);
1130
+ padding: 4px 8px;
1131
+ margin-top: 4px;
1132
+ margin-bottom: 4px;
1143
1133
  border-radius: 4px;
1144
- padding: 4px;
1145
- list-style: none;
1146
- cursor: pointer;
1147
- transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1134
+ transition: background-color 0.2s;
1135
+ box-sizing: border-box;
1148
1136
  }
1149
- .r-sidebar-drop-btn:hover {
1150
- color: var(--r-primary-500);
1151
- transition-delay: initial;
1137
+ .r-dropdown-link:hover {
1138
+ color: var(--r-main-900);
1139
+ background-color: var(--r-main-100);
1152
1140
  }
1153
- .r-sidebar-drop-btn::before {
1154
- content: "";
1155
- position: absolute;
1156
- inset: -4px;
1141
+
1142
+ .r-dropdown-link._active {
1143
+ color: var(--r-primary-700);
1144
+ }.r-header-social {
1145
+ display: flex;
1146
+ flex: 1;
1147
+ justify-content: flex-end;
1157
1148
  }
1158
- .r-sidebar-drop-btn::-webkit-details-marker {
1159
- display: none;
1149
+ @media screen and (width >= 1024px) {
1150
+ .r-header-social {
1151
+ flex: none;
1152
+ justify-content: unset;
1153
+ }
1160
1154
  }
1161
1155
 
1162
- .r-sidebar-drop-icon {
1163
- display: block;
1164
- transition: transform 0.2s;
1156
+ .r-header-social-git {
1157
+ color: var(--r-main-700);
1158
+ transition: color 0.2s;
1165
1159
  }
1166
-
1167
- .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
1168
- transform: rotate(90deg);
1160
+ .r-header-social-git:hover, .r-header-social-git:focus {
1161
+ color: var(--r-main-950);
1162
+ }.r-container {
1163
+ max-width: 1180px;
1164
+ padding-right: 12px;
1165
+ padding-left: 12px;
1166
+ margin-right: auto;
1167
+ margin-left: auto;
1168
+ box-sizing: border-box;
1169
1169
  }.r-theme-switcher {
1170
1170
  position: relative;
1171
1171
  display: flex;
@@ -1244,62 +1244,13 @@
1244
1244
 
1245
1245
  .r-keylink:not(:focus) {
1246
1246
  width: 1px !important;
1247
- height: 1px !important;
1248
- padding: 0 !important;
1249
- overflow: hidden !important;
1250
- clip: rect(1px, 1px, 1px, 1px) !important;
1251
- border: 0 !important;
1252
- user-select: none;
1253
- pointer-events: none;
1254
- box-sizing: border-box;
1255
- }.r-git-logo {
1256
- display: block;
1257
- }.r-backdrop {
1258
- position: fixed;
1259
- top: 0;
1260
- right: 0;
1261
- bottom: 0;
1262
- left: 0;
1263
- opacity: 0;
1264
- visibility: hidden;
1265
- pointer-events: none;
1266
- z-index: 100;
1267
- }
1268
-
1269
- .r-backdrop._visible {
1270
- opacity: 1;
1271
- visibility: visible;
1272
- pointer-events: all;
1273
- }.r-external-mark {
1274
- position: relative;
1275
- vertical-align: text-top;
1276
- display: inline-block;
1277
- margin-left: -4px;
1278
- margin-right: 2px;
1279
- width: 6px;
1280
- height: 6px;
1281
- box-sizing: border-box;
1282
- }
1283
- .r-external-mark::after {
1284
- content: "";
1285
- position: absolute;
1286
- top: 0;
1287
- right: 0;
1288
- width: 100%;
1289
- height: 100%;
1290
- border-top: 1px solid currentColor;
1291
- border-right: 1px solid currentColor;
1292
- box-sizing: border-box;
1293
- }
1294
- .r-external-mark::before {
1295
- content: "";
1296
- position: absolute;
1297
- top: 0;
1298
- right: 0;
1299
- width: 3px;
1300
- height: 3px;
1301
- background-color: currentColor;
1302
- border-radius: 0 0 0 4px;
1247
+ height: 1px !important;
1248
+ padding: 0 !important;
1249
+ overflow: hidden !important;
1250
+ clip: rect(1px, 1px, 1px, 1px) !important;
1251
+ border: 0 !important;
1252
+ user-select: none;
1253
+ pointer-events: none;
1303
1254
  box-sizing: border-box;
1304
1255
  }.r-breadcrumbs {
1305
1256
  grid-area: breadcrumbs;
@@ -1581,6 +1532,9 @@
1581
1532
  }
1582
1533
  .r-contents-git:hover {
1583
1534
  color: var(--r-main-900);
1535
+ }.r-last-modified {
1536
+ color: var(--r-main-700);
1537
+ margin-block-start: 16px;
1584
1538
  }.r-pagination {
1585
1539
  grid-area: pagination;
1586
1540
  display: grid;
@@ -1653,9 +1607,55 @@
1653
1607
 
1654
1608
  .r-pagination-svg {
1655
1609
  display: block;
1656
- }.r-last-modified {
1657
- color: var(--r-main-700);
1658
- margin-block-start: 16px;
1610
+ }.r-backdrop {
1611
+ position: fixed;
1612
+ top: 0;
1613
+ right: 0;
1614
+ bottom: 0;
1615
+ left: 0;
1616
+ opacity: 0;
1617
+ visibility: hidden;
1618
+ pointer-events: none;
1619
+ z-index: 100;
1620
+ }
1621
+
1622
+ .r-backdrop._visible {
1623
+ opacity: 1;
1624
+ visibility: visible;
1625
+ pointer-events: all;
1626
+ }.r-git-logo {
1627
+ display: block;
1628
+ }.r-external-mark {
1629
+ position: relative;
1630
+ vertical-align: text-top;
1631
+ display: inline-block;
1632
+ margin-left: -4px;
1633
+ margin-right: 2px;
1634
+ width: 6px;
1635
+ height: 6px;
1636
+ box-sizing: border-box;
1637
+ }
1638
+ .r-external-mark::after {
1639
+ content: "";
1640
+ position: absolute;
1641
+ top: 0;
1642
+ right: 0;
1643
+ width: 100%;
1644
+ height: 100%;
1645
+ border-top: 1px solid currentColor;
1646
+ border-right: 1px solid currentColor;
1647
+ box-sizing: border-box;
1648
+ }
1649
+ .r-external-mark::before {
1650
+ content: "";
1651
+ position: absolute;
1652
+ top: 0;
1653
+ right: 0;
1654
+ width: 3px;
1655
+ height: 3px;
1656
+ background-color: currentColor;
1657
+ border-radius: 0 0 0 4px;
1658
+ box-sizing: border-box;
1659
1659
  }.r-kbd-container {
1660
1660
  display: flex;
1661
1661
  gap: 4px;
@@ -1742,56 +1742,6 @@
1742
1742
 
1743
1743
  .r-code-section-filename {
1744
1744
  font-family: var(--monospace-font, monospace, monospace);
1745
- }.r-block {
1746
- position: relative;
1747
- width: 100%;
1748
- overflow: auto;
1749
- margin-block-start: 12px;
1750
- margin-block-end: 12px;
1751
- scrollbar-width: thin;
1752
- scrollbar-color: var(--r-main-200) transparent;
1753
- box-sizing: border-box;
1754
- z-index: 1;
1755
- }.r-h1 {
1756
- font-size: 32px;
1757
- line-height: 1.4;
1758
- margin-block-start: 0.67em;
1759
- margin-block-end: 0.67em;
1760
- }
1761
-
1762
- .r-h2 {
1763
- font-size: 26px;
1764
- line-height: 1.4;
1765
- margin-block-start: 0.83em;
1766
- margin-block-end: 0.83em;
1767
- }
1768
-
1769
- .r-h3 {
1770
- font-size: 22px;
1771
- line-height: 1.4;
1772
- margin-block-start: 1em;
1773
- margin-block-end: 1em;
1774
- }
1775
-
1776
- .r-h4 {
1777
- font-size: 20px;
1778
- line-height: 1.4;
1779
- margin-block-start: 1.33em;
1780
- margin-block-end: 1.33em;
1781
- }
1782
-
1783
- .r-h5 {
1784
- font-size: 18px;
1785
- line-height: 1.4;
1786
- margin-block-start: 1.5em;
1787
- margin-block-end: 1.5em;
1788
- }
1789
-
1790
- .r-h6 {
1791
- font-size: 16px;
1792
- line-height: 1.4;
1793
- margin-block-start: 1.8em;
1794
- margin-block-end: 1.8em;
1795
1745
  }.r-blockquote {
1796
1746
  padding: 4px 12px 4px 20px;
1797
1747
  border: 4px solid var(--r-main-100);
@@ -1849,13 +1799,63 @@
1849
1799
  }
1850
1800
  .r-blockquote-caution .r-blockquote-title {
1851
1801
  color: var(--r-caution);
1852
- }.r-p {
1853
- line-height: 1.8;
1802
+ }.r-block {
1803
+ position: relative;
1804
+ width: 100%;
1805
+ overflow: auto;
1806
+ margin-block-start: 12px;
1807
+ margin-block-end: 12px;
1808
+ scrollbar-width: thin;
1809
+ scrollbar-color: var(--r-main-200) transparent;
1810
+ box-sizing: border-box;
1811
+ z-index: 1;
1812
+ }.r-h1 {
1813
+ font-size: 32px;
1814
+ line-height: 1.4;
1815
+ margin-block-start: 0.67em;
1816
+ margin-block-end: 0.67em;
1817
+ }
1818
+
1819
+ .r-h2 {
1820
+ font-size: 26px;
1821
+ line-height: 1.4;
1822
+ margin-block-start: 0.83em;
1823
+ margin-block-end: 0.83em;
1824
+ }
1825
+
1826
+ .r-h3 {
1827
+ font-size: 22px;
1828
+ line-height: 1.4;
1854
1829
  margin-block-start: 1em;
1855
1830
  margin-block-end: 1em;
1831
+ }
1832
+
1833
+ .r-h4 {
1834
+ font-size: 20px;
1835
+ line-height: 1.4;
1836
+ margin-block-start: 1.33em;
1837
+ margin-block-end: 1.33em;
1838
+ }
1839
+
1840
+ .r-h5 {
1841
+ font-size: 18px;
1842
+ line-height: 1.4;
1843
+ margin-block-start: 1.5em;
1844
+ margin-block-end: 1.5em;
1845
+ }
1846
+
1847
+ .r-h6 {
1848
+ font-size: 16px;
1849
+ line-height: 1.4;
1850
+ margin-block-start: 1.8em;
1851
+ margin-block-end: 1.8em;
1856
1852
  }.r-img {
1857
1853
  max-width: 100%;
1858
1854
  box-sizing: border-box;
1855
+ }.r-p {
1856
+ line-height: 1.8;
1857
+ margin-block-start: 1em;
1858
+ margin-block-end: 1em;
1859
1859
  }.r-tabs {
1860
1860
  margin-block-start: 1.5em;
1861
1861
  margin-block-end: 1.75em;
@@ -1897,6 +1897,49 @@
1897
1897
 
1898
1898
  .r-tab-header-code {
1899
1899
  font-family: var(--monospace-font, monospace, monospace);
1900
+ }.r-copy-button {
1901
+ position: relative;
1902
+ padding: 6px;
1903
+ background: none;
1904
+ color: var(--r-main-700);
1905
+ border: 0;
1906
+ border-radius: 6px;
1907
+ cursor: pointer;
1908
+ font: inherit;
1909
+ transition: color 0.2s, background-color 0.2s;
1910
+ }
1911
+
1912
+ .r-copy-button-success {
1913
+ opacity: 0;
1914
+ transform: scale(0.7);
1915
+ transition: transform 0.2s;
1916
+ }
1917
+
1918
+ .r-copy-button-base {
1919
+ transition: transform 0.2s;
1920
+ }
1921
+
1922
+ .r-copy-button:hover {
1923
+ color: var(--r-main-950);
1924
+ }
1925
+
1926
+ .r-copy-button:active,
1927
+ .r-copy-button._active {
1928
+ color: var(--r-success);
1929
+ }
1930
+ .r-copy-button:active .r-copy-button-success,
1931
+ .r-copy-button._active .r-copy-button-success {
1932
+ opacity: 1;
1933
+ transform: scale(1);
1934
+ }
1935
+ .r-copy-button:active .r-copy-button-base,
1936
+ .r-copy-button._active .r-copy-button-base {
1937
+ opacity: 0;
1938
+ transform: scale(0.7);
1939
+ }
1940
+
1941
+ .r-copy-button-svg {
1942
+ display: block;
1900
1943
  }.r-content-link {
1901
1944
  text-decoration: none;
1902
1945
  color: inherit;
@@ -1946,49 +1989,6 @@
1946
1989
  background-color: currentColor;
1947
1990
  border-radius: 0 0 0 4px;
1948
1991
  box-sizing: border-box;
1949
- }.r-copy-button {
1950
- position: relative;
1951
- padding: 6px;
1952
- background: none;
1953
- color: var(--r-main-700);
1954
- border: 0;
1955
- border-radius: 6px;
1956
- cursor: pointer;
1957
- font: inherit;
1958
- transition: color 0.2s, background-color 0.2s;
1959
- }
1960
-
1961
- .r-copy-button-success {
1962
- opacity: 0;
1963
- transform: scale(0.7);
1964
- transition: transform 0.2s;
1965
- }
1966
-
1967
- .r-copy-button-base {
1968
- transition: transform 0.2s;
1969
- }
1970
-
1971
- .r-copy-button:hover {
1972
- color: var(--r-main-950);
1973
- }
1974
-
1975
- .r-copy-button:active,
1976
- .r-copy-button._active {
1977
- color: var(--r-success);
1978
- }
1979
- .r-copy-button:active .r-copy-button-success,
1980
- .r-copy-button._active .r-copy-button-success {
1981
- opacity: 1;
1982
- transform: scale(1);
1983
- }
1984
- .r-copy-button:active .r-copy-button-base,
1985
- .r-copy-button._active .r-copy-button-base {
1986
- opacity: 0;
1987
- transform: scale(0.7);
1988
- }
1989
-
1990
- .r-copy-button-svg {
1991
- display: block;
1992
1992
  }.r-copy-text {
1993
1993
  position: relative;
1994
1994
  cursor: pointer;
@@ -2132,10 +2132,10 @@
2132
2132
 
2133
2133
  .r-task-label-text {
2134
2134
  vertical-align: middle;
2135
- }.r-task-ul {
2136
- list-style: none;
2137
2135
  }.r-task-ol {
2138
2136
  list-style: none;
2137
+ }.r-task-ul {
2138
+ list-style: none;
2139
2139
  }.r-tooltip {
2140
2140
  font-family: var(--monospace-font, monospace, monospace);
2141
2141
  display: none;