robindoc 0.0.0-experimental-6035c0e → 0.0.0-experimental-7477c3a

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 +789 -789
  2. package/package.json +8 -8
package/lib/styles.css CHANGED
@@ -154,6 +154,42 @@
154
154
  }
155
155
  .r-powered-link:hover {
156
156
  color: var(--r-primary-900);
157
+ }.r-docs-container {
158
+ min-height: calc(100dvh - var(--r-header-height));
159
+ overflow-wrap: break-word;
160
+ box-sizing: border-box;
161
+ }
162
+ @media screen and (width >= 768px) {
163
+ .r-docs-container {
164
+ display: grid;
165
+ justify-content: center;
166
+ column-gap: 32px;
167
+ grid-template-areas: "sidebar breadcrumbs" "sidebar contents" "sidebar content" "sidebar pagination";
168
+ grid-template-columns: 1fr calc(100% - 248px);
169
+ grid-template-rows: auto auto 1fr auto;
170
+ }
171
+ }
172
+ @media screen and (width >= 1180px) {
173
+ .r-docs-container {
174
+ column-gap: 40px;
175
+ grid-template-areas: "sidebar breadcrumbs contents" "sidebar content contents" "sidebar pagination contents";
176
+ grid-template-columns: 200px 640px 238px;
177
+ grid-template-rows: auto 1fr auto;
178
+ }
179
+ }.r-blog-container {
180
+ min-height: calc(100dvh - var(--r-header-height));
181
+ overflow-wrap: break-word;
182
+ box-sizing: border-box;
183
+ }
184
+ @media screen and (width >= 1180px) {
185
+ .r-blog-container {
186
+ display: grid;
187
+ justify-content: space-between;
188
+ column-gap: 40px;
189
+ grid-template-areas: "breadcrumbs contents" "content contents" "pagination contents";
190
+ grid-template-columns: 760px 220px;
191
+ grid-template-rows: auto 1fr auto;
192
+ }
157
193
  }.r-root {
158
194
  --r-header-height: 60px;
159
195
  position: relative;
@@ -387,42 +423,6 @@
387
423
  --r-cl-60: #86181d;
388
424
  --r-cl-61: #144620;
389
425
  --r-cl-62: #c24e00;
390
- }.r-docs-container {
391
- min-height: calc(100dvh - var(--r-header-height));
392
- overflow-wrap: break-word;
393
- box-sizing: border-box;
394
- }
395
- @media screen and (width >= 768px) {
396
- .r-docs-container {
397
- display: grid;
398
- justify-content: center;
399
- column-gap: 32px;
400
- grid-template-areas: "sidebar breadcrumbs" "sidebar contents" "sidebar content" "sidebar pagination";
401
- grid-template-columns: 1fr calc(100% - 248px);
402
- grid-template-rows: auto auto 1fr auto;
403
- }
404
- }
405
- @media screen and (width >= 1180px) {
406
- .r-docs-container {
407
- column-gap: 40px;
408
- grid-template-areas: "sidebar breadcrumbs contents" "sidebar content contents" "sidebar pagination contents";
409
- grid-template-columns: 200px 640px 238px;
410
- grid-template-rows: auto 1fr auto;
411
- }
412
- }.r-blog-container {
413
- min-height: calc(100dvh - var(--r-header-height));
414
- overflow-wrap: break-word;
415
- box-sizing: border-box;
416
- }
417
- @media screen and (width >= 1180px) {
418
- .r-blog-container {
419
- display: grid;
420
- justify-content: space-between;
421
- column-gap: 40px;
422
- grid-template-areas: "breadcrumbs contents" "content contents" "pagination contents";
423
- grid-template-columns: 760px 220px;
424
- grid-template-rows: auto 1fr auto;
425
- }
426
426
  }.r-page-container {
427
427
  min-height: calc(100dvh - var(--r-header-height));
428
428
  overflow-wrap: break-word;
@@ -434,58 +434,6 @@
434
434
  z-index: 1001;
435
435
  }.r-keylink.keylink-to-navigation:focus {
436
436
  margin-top: -40px;
437
- }.r-article {
438
- padding: 20px 0 40px;
439
- grid-area: content;
440
- }
441
- @media screen and (width >= 1180px) {
442
- .r-article {
443
- padding: 32px 0 40px;
444
- }
445
- }
446
- .r-article > *:first-child {
447
- margin-top: 0;
448
- }
449
- .r-article > *:last-child {
450
- margin-bottom: 0;
451
- }
452
-
453
- .r-checkbox {
454
- cursor: pointer;
455
- width: 20px;
456
- height: 20px;
457
- margin: 4px;
458
- vertical-align: middle;
459
- box-sizing: border-box;
460
- }
461
-
462
- .r-label {
463
- cursor: pointer;
464
- }
465
-
466
- .r-task-ol,
467
- .r-task-ul {
468
- list-style: none;
469
- }
470
-
471
- .r-task-label {
472
- display: block;
473
- width: 100%;
474
- padding-top: 2px;
475
- padding-bottom: 2px;
476
- box-sizing: border-box;
477
- }
478
- .r-task-label:hover .r-checkbox {
479
- filter: brightness(0.8);
480
- }
481
-
482
- .r-task-li.r-task-li {
483
- margin-block-start: 2px;
484
- margin-block-end: 2px;
485
- }
486
-
487
- .r-label-text {
488
- vertical-align: middle;
489
437
  }.r-code-span {
490
438
  font-family: var(--monospace-font, monospace, monospace);
491
439
  background-color: var(--r-main-100);
@@ -500,458 +448,271 @@
500
448
 
501
449
  .r-code-span + .r-content-link-external {
502
450
  margin-left: -12px;
503
- }.r-sidebar {
504
- grid-area: sidebar;
505
- box-sizing: border-box;
451
+ }.r-header-menu {
452
+ display: flex;
453
+ justify-content: flex-end;
454
+ order: 1;
506
455
  }
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;
456
+ @media screen and (width >= 1024px) {
457
+ .r-header-menu {
458
+ flex: 1;
459
+ order: unset;
520
460
  }
521
461
  }
522
462
 
523
- .r-sidebar-top-mock {
524
- grid-row-start: 1;
525
- grid-column-start: 1;
526
- }
527
-
528
- @media screen and (width < 768px) {
529
- .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
530
- display: none;
531
- }
463
+ .r-header-input:checked ~ .r-header-burger ~ .r-header-responsive {
464
+ display: flex;
532
465
  }
533
466
 
534
- .r-sidebar-nav {
535
- box-sizing: border-box;
467
+ .r-header-responsive {
468
+ display: none;
469
+ justify-content: flex-end;
470
+ flex: 1;
471
+ gap: 24px;
472
+ z-index: 1;
536
473
  }
537
- @media screen and (width < 768px) {
538
- .r-sidebar-nav {
539
- overflow: auto;
540
- max-height: calc(100dvh - var(--r-header-height) - 41px);
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;
541
484
  }
542
485
  }
543
-
544
- .r-sidebar-drop {
545
- margin-top: -4px;
546
- padding-top: 4px;
486
+ @media screen and (width >= 1024px) {
487
+ .r-header-responsive {
488
+ display: flex;
489
+ justify-content: space-between;
490
+ align-items: center;
491
+ }
547
492
  }
548
493
 
549
- .r-sidebar-sublist {
494
+ .r-header-burger {
550
495
  position: relative;
551
- padding-top: 2px;
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;
504
+ box-sizing: border-box;
552
505
  }
553
- .r-sidebar-sublist:hover::before {
554
- background-color: var(--r-primary-800);
555
- transition-delay: initial;
506
+ @media screen and (width >= 1024px) {
507
+ .r-header-burger {
508
+ display: none;
509
+ }
556
510
  }
557
511
 
558
- .r-sidebar-sublist::before {
559
- content: "";
512
+ .r-burger-line {
513
+ display: block;
514
+ width: 20px;
515
+ height: 1.5px;
560
516
  position: absolute;
561
- top: 0;
562
- left: -12px;
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;
517
+ background-color: var(--r-main-700);
518
+ margin: auto;
519
+ transition: transform 0.3s;
569
520
  box-sizing: border-box;
570
521
  }
571
522
 
572
- .r-sidebar-nav {
573
- padding: 32px 4px 32px 2px;
574
- box-sizing: border-box;
575
- }
576
- @media screen and (width < 768px) {
577
- .r-sidebar-nav {
578
- padding: 12px;
579
- }
523
+ .r-burger-line._top {
524
+ transform: translateY(-3px);
580
525
  }
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
- }
526
+
527
+ .r-header-input:checked ~ .r-header-burger .r-burger-line._top {
528
+ transform: translateY(0) rotate(45deg);
529
+ margin-top: 0;
591
530
  }
592
531
 
593
- .r-sidebar-space {
594
- box-sizing: border-box;
532
+ .r-burger-line._bottom {
533
+ transform: translateY(3px);
595
534
  }
596
- @media screen and (width < 768px) {
597
- .r-sidebar-space {
598
- display: block;
599
- height: 40px;
600
- }
535
+
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 {
540
+ 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);
601
555
  }
602
556
 
603
- .r-sidebar-btn {
604
- position: sticky;
605
- top: 0;
557
+ .r-dropdown-summary {
606
558
  display: flex;
559
+ justify-content: space-between;
560
+ align-items: center;
607
561
  width: 100%;
608
- font-size: 14px;
562
+ position: relative;
563
+ color: inherit;
564
+ cursor: pointer;
565
+ padding: 10px 4px;
566
+ font-size: 16px;
609
567
  border: 0;
610
- padding: 12px;
611
568
  background: none;
612
- cursor: pointer;
613
- color: var(--r-main-800);
614
- background-color: var(--r-main-50);
615
569
  z-index: 1;
616
570
  box-sizing: border-box;
617
571
  }
618
- @media screen and (width >= 768px) {
619
- .r-sidebar-btn {
620
- display: none;
621
- }
622
- }
623
572
 
624
- .r-sidebar-chevron {
625
- display: inline;
626
- margin-right: 6px;
627
- transition: transform 0.2s;
573
+ .r-dropdown-chevron {
574
+ display: block;
575
+ margin-left: 6px;
576
+ transition: transform 0.3s 0.1s;
628
577
  box-sizing: border-box;
629
578
  }
630
579
 
631
- .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
632
- transform: rotate(90deg);
633
- }
634
-
635
- .r-sidebar-list {
636
- color: var(--r-main-700);
580
+ .r-dropdown-drop {
637
581
  list-style: none;
638
- padding: 0;
582
+ position: absolute;
583
+ top: 16px;
584
+ 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;
639
592
  margin: 0;
640
- font-size: 14px;
593
+ padding: 2px 6px;
594
+ min-width: 120px;
595
+ max-width: 180px;
641
596
  box-sizing: border-box;
642
597
  }
643
598
 
644
- .r-sidebar-drop::details-content {
645
- overflow: hidden;
646
- transition: content-visibility 0.4s allow-discrete;
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;
647
609
  box-sizing: border-box;
648
610
  }
649
-
650
- .r-sidebar-sublist {
651
- margin-left: 12px;
652
- }
653
-
654
- .r-sidebar-drop > .r-sidebar-sublist {
655
- opacity: 0;
656
- transition: opacity 0.2s ease;
657
- }
658
-
659
- .r-sidebar-drop[open] > .r-sidebar-sublist {
660
- opacity: 1;
611
+ .r-dropdown-link:hover {
612
+ color: var(--r-main-900);
613
+ background-color: var(--r-main-100);
661
614
  }
662
615
 
663
- .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
664
- margin-top: -4rem;
665
- transition: margin-top 0.3s ease;
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;
666
622
  }
667
-
668
- @starting-style {
669
- .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
670
- margin-top: -4rem;
623
+ @media screen and (width >= 1024px) {
624
+ .r-header-social {
625
+ flex: none;
626
+ justify-content: unset;
671
627
  }
672
628
  }
673
629
 
674
- .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
675
- margin-top: 0;
630
+ .r-header-social-git {
631
+ color: var(--r-main-700);
632
+ transition: color 0.2s;
676
633
  }
677
-
678
- .r-sidebar-sublist .r-sidebar-link {
634
+ .r-header-social-git:hover, .r-header-social-git:focus {
635
+ color: var(--r-main-950);
636
+ }.r-container {
637
+ max-width: 1180px;
638
+ padding-right: 12px;
639
+ padding-left: 12px;
640
+ margin-right: auto;
641
+ margin-left: auto;
642
+ box-sizing: border-box;
643
+ }.r-search-btn {
679
644
  position: relative;
680
- border-top-left-radius: 0;
681
- border-bottom-left-radius: 0;
645
+ border-radius: 6px;
646
+ background-color: var(--r-main-100);
647
+ color: var(--r-main-600);
648
+ padding: 8px 16px;
649
+ border: 1px solid var(--r-main-200);
650
+ width: 100%;
651
+ text-align: left;
652
+ cursor: text;
682
653
  box-sizing: border-box;
683
654
  }
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;
655
+ @media screen and (width >= 768px) {
656
+ .r-search-btn {
657
+ width: 220px;
658
+ padding: 8px 96px 8px 16px;
659
+ }
694
660
  }
695
-
696
- .r-sidebar-li {
697
- position: relative;
698
- line-height: 1.5;
661
+ .r-search-btn:hover {
662
+ border-color: var(--r-main-600);
699
663
  }
700
-
701
- .r-sidebar-li._separator {
702
- background: var(--r-main-200);
703
- padding: 1px;
664
+ .r-search-btn:hover .r-search-kbd {
665
+ color: var(--r-main-950);
704
666
  }
705
667
 
706
- .r-sidebar-li._droppable > a {
707
- padding-right: 32px;
668
+ .r-search-title {
669
+ display: block;
670
+ overflow: hidden;
671
+ text-overflow: ellipsis;
672
+ white-space: nowrap;
708
673
  }
709
674
 
710
- .r-sidebar-li-d0 {
711
- margin-left: -8px;
675
+ .r-search-kbd {
676
+ display: none;
677
+ position: absolute;
678
+ right: 6px;
679
+ top: 50%;
680
+ transform: translateY(-50%);
712
681
  }
713
-
714
- .r-sidebar-p {
715
- margin: 0;
716
- padding: 4px 10px;
682
+ @media screen and (width >= 768px) {
683
+ .r-search-kbd {
684
+ display: flex;
685
+ }
717
686
  }
718
687
 
719
- .r-sidebar-heading {
720
- color: var(--r-main-900);
721
- font-weight: 600;
722
- margin-block-end: 4px;
723
- }
724
- .r-sidebar-heading:not(:first-child) {
725
- margin-block-start: 12px;
688
+ .r-search-dialog {
689
+ width: 100%;
690
+ height: 100%;
691
+ background: none;
692
+ max-width: none;
693
+ max-height: none;
694
+ border: none;
695
+ padding: unset;
696
+ transition: opacity 0.3s ease, overlay 0.4s ease-out allow-discrete, display 0.4s ease-out allow-discrete;
697
+ opacity: 0;
726
698
  }
727
-
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;
699
+ .r-search-dialog::backdrop {
700
+ backdrop-filter: blur(0);
701
+ background: color-mix(in srgb, var(--r-main-900) 0%, transparent 100%);
702
+ transition: backdrop-filter 0.4s ease-out, background 0.4s ease-out;
739
703
  }
740
704
 
741
- .r-sidebar-link._target {
742
- color: var(--r-primary-950);
743
- background-color: var(--r-main-50);
705
+ .r-search-dialog[open] {
706
+ opacity: 1;
744
707
  }
745
-
746
- .r-sidebar-link:hover {
747
- color: var(--r-primary-800);
748
- background-color: var(--r-main-100);
749
- transition-delay: initial;
708
+ @starting-style {
709
+ .r-search-dialog[open] {
710
+ opacity: 0;
711
+ }
750
712
  }
751
- .r-sidebar-link:hover::before {
752
- background-color: currentColor;
753
- transition-delay: initial;
754
- }
755
-
756
- .r-sidebar-link._active {
757
- color: var(--r-primary-700);
758
- background-color: var(--r-main-50);
759
- }
760
- .r-sidebar-link._active::before {
761
- background-color: currentColor;
762
- }
763
-
764
- .r-sidebar-drop-btn {
765
- position: absolute;
766
- right: 3px;
767
- top: 5px;
768
- border-radius: 4px;
769
- padding: 4px;
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;
785
- }
786
-
787
- .r-sidebar-drop-icon {
788
- display: block;
789
- transition: transform 0.2s;
790
- }
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
- }
804
- }
805
-
806
- .r-header-input:checked ~ .r-header-burger ~ .r-header-responsive {
807
- display: flex;
808
- }
809
-
810
- .r-header-responsive {
811
- display: none;
812
- justify-content: flex-end;
813
- flex: 1;
814
- gap: 24px;
815
- z-index: 1;
816
- }
817
- @media screen and (width < 1024px) {
818
- .r-header-responsive {
819
- flex-direction: column-reverse;
820
- padding: 12px;
821
- background-color: var(--r-main-50);
822
- position: fixed;
823
- top: 60px;
824
- right: 0;
825
- bottom: 0;
826
- left: 0;
827
- }
828
- }
829
- @media screen and (width >= 1024px) {
830
- .r-header-responsive {
831
- display: flex;
832
- justify-content: space-between;
833
- align-items: center;
834
- }
835
- }
836
-
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;
847
- box-sizing: border-box;
848
- }
849
- @media screen and (width >= 1024px) {
850
- .r-header-burger {
851
- display: none;
852
- }
853
- }
854
-
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;
864
- }
865
-
866
- .r-burger-line._top {
867
- transform: translateY(-3px);
868
- }
869
-
870
- .r-header-input:checked ~ .r-header-burger .r-burger-line._top {
871
- transform: translateY(0) rotate(45deg);
872
- margin-top: 0;
873
- }
874
-
875
- .r-burger-line._bottom {
876
- transform: translateY(3px);
877
- }
878
-
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;
892
- box-sizing: border-box;
893
- }
894
- @media screen and (width >= 768px) {
895
- .r-search-btn {
896
- width: 220px;
897
- padding: 8px 96px 8px 16px;
898
- }
899
- }
900
- .r-search-btn:hover {
901
- border-color: var(--r-main-600);
902
- }
903
- .r-search-btn:hover .r-search-kbd {
904
- color: var(--r-main-950);
905
- }
906
-
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%);
920
- }
921
- @media screen and (width >= 768px) {
922
- .r-search-kbd {
923
- display: flex;
924
- }
925
- }
926
-
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;
937
- }
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;
942
- }
943
-
944
- .r-search-dialog[open] {
945
- opacity: 1;
946
- }
947
- @starting-style {
948
- .r-search-dialog[open] {
949
- opacity: 0;
950
- }
951
- }
952
- .r-search-dialog[open]::backdrop {
953
- backdrop-filter: blur(4px);
954
- background: color-mix(in srgb, var(--r-main-900) 40%, transparent 100%);
713
+ .r-search-dialog[open]::backdrop {
714
+ backdrop-filter: blur(4px);
715
+ background: color-mix(in srgb, var(--r-main-900) 40%, transparent 100%);
955
716
  }
956
717
 
957
718
  .r-search-popup {
@@ -1062,196 +823,597 @@
1062
823
  font-size: 14px;
1063
824
  color: var(--r-main-600);
1064
825
  margin: 12px 0 0;
1065
- }.r-dropdown {
826
+ }.r-theme-switcher {
1066
827
  position: relative;
1067
- color: var(--r-main-600);
1068
- transition: color 0.2s 0.1s;
1069
- }
1070
- .r-dropdown:hover, .r-dropdown:focus-within {
1071
- color: var(--r-main-950);
1072
- }
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;
1078
- }
1079
- .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
1080
- transform: rotate(180deg);
1081
- }
1082
-
1083
- .r-dropdown-summary {
1084
828
  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;
829
+ gap: 4px;
830
+ width: 109px;
831
+ height: 37px;
832
+ padding: 2px;
833
+ background-color: var(--r-main-100);
834
+ border: 1px solid var(--r-main-200);
835
+ border-radius: 100px;
1096
836
  box-sizing: border-box;
1097
837
  }
1098
-
1099
- .r-dropdown-chevron {
838
+ .r-theme-switcher::before {
839
+ content: "";
840
+ position: absolute;
1100
841
  display: block;
1101
- margin-left: 6px;
1102
- transition: transform 0.3s 0.1s;
842
+ height: 32px;
843
+ width: 32px;
844
+ top: 2px;
845
+ left: 2px;
846
+ background-color: var(--r-main-50);
847
+ border: 1px solid var(--r-main-200);
848
+ border-radius: 100px;
849
+ transition: left 0.2s;
1103
850
  box-sizing: border-box;
1104
851
  }
1105
852
 
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;
1115
- background-color: var(--r-main-50);
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;
853
+ .r-theme-switcher-btn {
854
+ padding: 8px;
855
+ background: none;
856
+ border: 0;
857
+ border-radius: 100px;
858
+ cursor: pointer;
859
+ color: var(--r-main-700);
860
+ fill: transparent;
861
+ z-index: 1;
862
+ transition: color 0.2s 0.1s, fill 0.2s;
863
+ }
864
+ .r-theme-switcher-btn:hover {
865
+ color: var(--r-main-950);
866
+ fill: var(--r-main-600);
867
+ }
868
+
869
+ .r-theme-dark:not(.r-theme-system) .r-theme-switcher::before {
870
+ left: 2px;
871
+ }
872
+
873
+ .r-theme-dark:not(.r-theme-system) .r-theme-switcher-btn__dark,
874
+ .r-theme-system .r-theme-switcher-btn__system,
875
+ .r-theme-light:not(.r-theme-system) .r-theme-switcher-btn__light {
876
+ color: var(--r-main-950);
877
+ fill: var(--r-main-950);
878
+ pointer-events: none;
879
+ }
880
+
881
+ .r-theme-switcher::before,
882
+ .r-theme-system .r-theme-switcher::before {
883
+ left: 38px;
884
+ }
885
+
886
+ .r-theme-light:not(.r-theme-system) .r-theme-switcher::before {
887
+ left: 74px;
888
+ }
889
+
890
+ .r-theme-switcher-svg {
891
+ display: block;
892
+ }.r-article {
893
+ padding: 20px 0 40px;
894
+ grid-area: content;
895
+ }
896
+ @media screen and (width >= 1180px) {
897
+ .r-article {
898
+ padding: 32px 0 40px;
899
+ }
900
+ }
901
+ .r-article > *:first-child {
902
+ margin-top: 0;
903
+ }
904
+ .r-article > *:last-child {
905
+ margin-bottom: 0;
906
+ }
907
+
908
+ .r-checkbox {
909
+ cursor: pointer;
910
+ width: 20px;
911
+ height: 20px;
912
+ margin: 4px;
913
+ vertical-align: middle;
1122
914
  box-sizing: border-box;
1123
915
  }
1124
916
 
1125
- .r-dropdown-link {
917
+ .r-label {
918
+ cursor: pointer;
919
+ }
920
+
921
+ .r-task-ol,
922
+ .r-task-ul {
923
+ list-style: none;
924
+ }
925
+
926
+ .r-task-label {
1126
927
  display: block;
1127
928
  width: 100%;
1128
- text-decoration: none;
1129
- color: var(--r-main-700);
1130
- padding: 4px 8px;
1131
- margin-top: 4px;
1132
- margin-bottom: 4px;
1133
- border-radius: 4px;
1134
- transition: background-color 0.2s;
929
+ padding-top: 2px;
930
+ padding-bottom: 2px;
1135
931
  box-sizing: border-box;
1136
932
  }
1137
- .r-dropdown-link:hover {
1138
- color: var(--r-main-900);
1139
- background-color: var(--r-main-100);
933
+ .r-task-label:hover .r-checkbox {
934
+ filter: brightness(0.8);
1140
935
  }
1141
936
 
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;
937
+ .r-task-li.r-task-li {
938
+ margin-block-start: 2px;
939
+ margin-block-end: 2px;
1148
940
  }
1149
- @media screen and (width >= 1024px) {
1150
- .r-header-social {
1151
- flex: none;
1152
- justify-content: unset;
941
+
942
+ .r-label-text {
943
+ vertical-align: middle;
944
+ }.r-sidebar {
945
+ grid-area: sidebar;
946
+ box-sizing: border-box;
947
+ }
948
+ @media screen and (width < 768px) {
949
+ .r-sidebar {
950
+ position: sticky;
951
+ width: calc(100% + 24px);
952
+ top: var(--r-header-height);
953
+ left: 0;
954
+ margin: 0 -12px;
955
+ background-color: var(--r-main-50);
956
+ border-bottom: 1px solid var(--r-main-200);
957
+ z-index: 10;
958
+ opacity: 0.98;
959
+ padding: 0;
960
+ overflow: auto;
1153
961
  }
1154
962
  }
1155
963
 
1156
- .r-header-social-git {
1157
- color: var(--r-main-700);
1158
- transition: color 0.2s;
964
+ .r-sidebar-top-mock {
965
+ grid-row-start: 1;
966
+ grid-column-start: 1;
1159
967
  }
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;
968
+
969
+ @media screen and (width < 768px) {
970
+ .r-sidebar-input:not(:checked) ~ .r-sidebar-btn ~ .r-sidebar-nav {
971
+ display: none;
972
+ }
973
+ }
974
+
975
+ .r-sidebar-nav {
1168
976
  box-sizing: border-box;
1169
- }.r-theme-switcher {
977
+ }
978
+ @media screen and (width < 768px) {
979
+ .r-sidebar-nav {
980
+ overflow: auto;
981
+ max-height: calc(100dvh - var(--r-header-height) - 41px);
982
+ }
983
+ }
984
+
985
+ .r-sidebar-drop {
986
+ margin-top: -4px;
987
+ padding-top: 4px;
988
+ }
989
+
990
+ .r-sidebar-sublist {
1170
991
  position: relative;
1171
- display: flex;
1172
- gap: 4px;
1173
- width: 109px;
1174
- height: 37px;
1175
- padding: 2px;
1176
- background-color: var(--r-main-100);
1177
- border: 1px solid var(--r-main-200);
1178
- border-radius: 100px;
1179
- box-sizing: border-box;
992
+ padding-top: 2px;
1180
993
  }
1181
- .r-theme-switcher::before {
994
+ .r-sidebar-sublist:hover::before {
995
+ background-color: var(--r-primary-800);
996
+ transition-delay: initial;
997
+ }
998
+
999
+ .r-sidebar-sublist::before {
1182
1000
  content: "";
1183
1001
  position: absolute;
1184
- display: block;
1185
- height: 32px;
1186
- width: 32px;
1187
- top: 2px;
1188
- left: 2px;
1189
- background-color: var(--r-main-50);
1190
- border: 1px solid var(--r-main-200);
1191
- border-radius: 100px;
1192
- transition: left 0.2s;
1002
+ top: 0;
1003
+ left: -12px;
1004
+ right: 0;
1005
+ height: 2px;
1006
+ border-bottom-left-radius: 2px;
1007
+ background-color: var(--r-main-200);
1008
+ z-index: 1;
1009
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1193
1010
  box-sizing: border-box;
1194
1011
  }
1195
1012
 
1196
- .r-theme-switcher-btn {
1197
- padding: 8px;
1198
- background: none;
1013
+ .r-sidebar-nav {
1014
+ padding: 32px 4px 32px 2px;
1015
+ box-sizing: border-box;
1016
+ }
1017
+ @media screen and (width < 768px) {
1018
+ .r-sidebar-nav {
1019
+ padding: 12px;
1020
+ }
1021
+ }
1022
+ @media screen and (width >= 768px) {
1023
+ .r-sidebar-nav {
1024
+ position: sticky;
1025
+ top: var(--r-header-height);
1026
+ overflow: auto;
1027
+ scrollbar-width: thin;
1028
+ scrollbar-color: var(--r-main-200) transparent;
1029
+ scrollbar-gutter: stable;
1030
+ max-height: calc(100dvh - var(--r-header-height));
1031
+ }
1032
+ }
1033
+
1034
+ .r-sidebar-space {
1035
+ box-sizing: border-box;
1036
+ }
1037
+ @media screen and (width < 768px) {
1038
+ .r-sidebar-space {
1039
+ display: block;
1040
+ height: 40px;
1041
+ }
1042
+ }
1043
+
1044
+ .r-sidebar-btn {
1045
+ position: sticky;
1046
+ top: 0;
1047
+ display: flex;
1048
+ width: 100%;
1049
+ font-size: 14px;
1199
1050
  border: 0;
1200
- border-radius: 100px;
1051
+ padding: 12px;
1052
+ background: none;
1201
1053
  cursor: pointer;
1202
- color: var(--r-main-700);
1203
- fill: transparent;
1054
+ color: var(--r-main-800);
1055
+ background-color: var(--r-main-50);
1204
1056
  z-index: 1;
1205
- transition: color 0.2s 0.1s, fill 0.2s;
1057
+ box-sizing: border-box;
1058
+ }
1059
+ @media screen and (width >= 768px) {
1060
+ .r-sidebar-btn {
1061
+ display: none;
1062
+ }
1063
+ }
1064
+
1065
+ .r-sidebar-chevron {
1066
+ display: inline;
1067
+ margin-right: 6px;
1068
+ transition: transform 0.2s;
1069
+ box-sizing: border-box;
1070
+ }
1071
+
1072
+ .r-sidebar-input:checked ~ .r-sidebar-btn .r-sidebar-chevron {
1073
+ transform: rotate(90deg);
1074
+ }
1075
+
1076
+ .r-sidebar-list {
1077
+ color: var(--r-main-700);
1078
+ list-style: none;
1079
+ padding: 0;
1080
+ margin: 0;
1081
+ font-size: 14px;
1082
+ box-sizing: border-box;
1083
+ }
1084
+
1085
+ .r-sidebar-drop::details-content {
1086
+ overflow: hidden;
1087
+ transition: content-visibility 0.4s allow-discrete;
1088
+ box-sizing: border-box;
1089
+ }
1090
+
1091
+ .r-sidebar-sublist {
1092
+ margin-left: 12px;
1093
+ }
1094
+
1095
+ .r-sidebar-drop > .r-sidebar-sublist {
1096
+ opacity: 0;
1097
+ transition: opacity 0.2s ease;
1098
+ }
1099
+
1100
+ .r-sidebar-drop[open] > .r-sidebar-sublist {
1101
+ opacity: 1;
1102
+ }
1103
+
1104
+ .r-sidebar-drop > .r-sidebar-sublist > .r-sidebar-li {
1105
+ margin-top: -4rem;
1106
+ transition: margin-top 0.3s ease;
1107
+ }
1108
+
1109
+ @starting-style {
1110
+ .r-sidebar-drop[open]._starting-style > .r-sidebar-sublist > .r-sidebar-li {
1111
+ margin-top: -4rem;
1112
+ }
1113
+ }
1114
+
1115
+ .r-sidebar-drop[open] > .r-sidebar-sublist > .r-sidebar-li {
1116
+ margin-top: 0;
1117
+ }
1118
+
1119
+ .r-sidebar-sublist .r-sidebar-link {
1120
+ position: relative;
1121
+ border-top-left-radius: 0;
1122
+ border-bottom-left-radius: 0;
1123
+ box-sizing: border-box;
1124
+ }
1125
+ .r-sidebar-sublist .r-sidebar-link::before {
1126
+ content: "";
1127
+ position: absolute;
1128
+ left: 0;
1129
+ top: -1px;
1130
+ width: 1px;
1131
+ height: calc(100% + 4px);
1132
+ background-color: var(--r-main-200);
1133
+ transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1134
+ box-sizing: border-box;
1135
+ }
1136
+
1137
+ .r-sidebar-li {
1138
+ position: relative;
1139
+ line-height: 1.5;
1140
+ }
1141
+
1142
+ .r-sidebar-li._separator {
1143
+ background: var(--r-main-200);
1144
+ padding: 1px;
1145
+ }
1146
+
1147
+ .r-sidebar-li._droppable > a {
1148
+ padding-right: 32px;
1149
+ }
1150
+
1151
+ .r-sidebar-li-d0 {
1152
+ margin-left: -8px;
1153
+ }
1154
+
1155
+ .r-sidebar-p {
1156
+ margin: 0;
1157
+ padding: 4px 10px;
1158
+ }
1159
+
1160
+ .r-sidebar-heading {
1161
+ color: var(--r-main-900);
1162
+ font-weight: 600;
1163
+ margin-block-end: 4px;
1164
+ }
1165
+ .r-sidebar-heading:not(:first-child) {
1166
+ margin-block-start: 12px;
1167
+ }
1168
+
1169
+ .r-sidebar-link {
1170
+ padding: 4px 10px;
1171
+ color: inherit;
1172
+ border-bottom: 2px solid transparent;
1173
+ border-radius: 2px;
1174
+ text-decoration: none;
1175
+ display: -webkit-box;
1176
+ -webkit-box-orient: vertical;
1177
+ -webkit-line-clamp: 3;
1178
+ overflow: hidden;
1179
+ 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
+ }
1181
+
1182
+ .r-sidebar-link._target {
1183
+ color: var(--r-primary-950);
1184
+ background-color: var(--r-main-50);
1185
+ }
1186
+
1187
+ .r-sidebar-link:hover {
1188
+ color: var(--r-primary-800);
1189
+ background-color: var(--r-main-100);
1190
+ transition-delay: initial;
1191
+ }
1192
+ .r-sidebar-link:hover::before {
1193
+ background-color: currentColor;
1194
+ transition-delay: initial;
1195
+ }
1196
+
1197
+ .r-sidebar-link._active {
1198
+ color: var(--r-primary-700);
1199
+ background-color: var(--r-main-50);
1200
+ }
1201
+ .r-sidebar-link._active::before {
1202
+ background-color: currentColor;
1203
+ }
1204
+
1205
+ .r-sidebar-drop-btn {
1206
+ position: absolute;
1207
+ right: 3px;
1208
+ top: 5px;
1209
+ border-radius: 4px;
1210
+ padding: 4px;
1211
+ list-style: none;
1212
+ cursor: pointer;
1213
+ transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
1214
+ }
1215
+ .r-sidebar-drop-btn:hover {
1216
+ color: var(--r-primary-500);
1217
+ transition-delay: initial;
1218
+ }
1219
+ .r-sidebar-drop-btn::before {
1220
+ content: "";
1221
+ position: absolute;
1222
+ inset: -4px;
1223
+ }
1224
+ .r-sidebar-drop-btn::-webkit-details-marker {
1225
+ display: none;
1226
+ }
1227
+
1228
+ .r-sidebar-drop-icon {
1229
+ display: block;
1230
+ transition: transform 0.2s;
1231
+ }
1232
+
1233
+ .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
1234
+ transform: rotate(90deg);
1235
+ }.r-keylink {
1236
+ display: block;
1237
+ position: relative;
1238
+ padding: 8px 12px;
1239
+ border: 2px solid var(--r-main-500);
1240
+ border-radius: 6px;
1241
+ text-decoration: none;
1242
+ background: var(--r-main-50);
1243
+ }
1244
+
1245
+ .r-keylink:not(:focus) {
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;
1303
+ box-sizing: border-box;
1304
+ }.r-breadcrumbs {
1305
+ grid-area: breadcrumbs;
1306
+ list-style: none;
1307
+ margin: 0;
1308
+ padding: 20px 0 0;
1309
+ line-height: 2;
1310
+ }
1311
+ @media screen and (width >= 768px) {
1312
+ .r-breadcrumbs {
1313
+ padding: 32px 0 0;
1314
+ }
1315
+ }
1316
+
1317
+ .r-breadcrumb {
1318
+ display: inline;
1319
+ }
1320
+
1321
+ .r-breadcrumb._previous::after {
1322
+ content: "/";
1323
+ font-weight: 600;
1324
+ margin-inline: 8px;
1325
+ }
1326
+
1327
+ .r-breadcrumb-link {
1328
+ color: var(--r-main-700);
1329
+ text-decoration: none;
1330
+ }
1331
+ .r-breadcrumb-link:hover {
1332
+ color: var(--r-primary-800);
1333
+ }
1334
+
1335
+ .r-breadcrumb-link,
1336
+ .r-breadcrumb-title {
1337
+ display: inline;
1338
+ padding: 6px 0;
1339
+ margin: 0;
1340
+ }
1341
+
1342
+ .r-breadcrumb-title {
1343
+ color: var(--r-main-950);
1344
+ font-weight: 600;
1345
+ }.r-pagination {
1346
+ grid-area: pagination;
1347
+ display: grid;
1348
+ grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1349
+ gap: 16px;
1350
+ margin-bottom: 40px;
1351
+ }
1352
+
1353
+ .r-pagination-item {
1354
+ position: relative;
1355
+ padding-top: 8px;
1356
+ padding-bottom: 8px;
1357
+ text-decoration: none;
1358
+ font-size: 14px;
1359
+ color: var(--r-main-800);
1360
+ }
1361
+ .r-pagination-item:hover {
1362
+ color: var(--r-main-950);
1363
+ }
1364
+
1365
+ .r-pagination-item._prev {
1366
+ padding-left: 28px;
1206
1367
  }
1207
- .r-theme-switcher-btn:hover {
1208
- color: var(--r-main-950);
1209
- fill: var(--r-main-600);
1368
+
1369
+ .r-pagination-item._next {
1370
+ text-align: right;
1371
+ padding-right: 28px;
1210
1372
  }
1211
1373
 
1212
- .r-theme-dark:not(.r-theme-system) .r-theme-switcher::before {
1213
- left: 2px;
1374
+ .r-pagination-text {
1375
+ display: block;
1376
+ line-height: 2;
1214
1377
  }
1215
1378
 
1216
- .r-theme-dark:not(.r-theme-system) .r-theme-switcher-btn__dark,
1217
- .r-theme-system .r-theme-switcher-btn__system,
1218
- .r-theme-light:not(.r-theme-system) .r-theme-switcher-btn__light {
1219
- color: var(--r-main-950);
1220
- fill: var(--r-main-950);
1221
- pointer-events: none;
1379
+ .r-pagination-title {
1380
+ font-weight: 600;
1381
+ font-size: 16px;
1222
1382
  }
1223
1383
 
1224
- .r-theme-switcher::before,
1225
- .r-theme-system .r-theme-switcher::before {
1226
- left: 38px;
1384
+ .r-pagination-icon {
1385
+ position: absolute;
1386
+ top: 50%;
1387
+ transform: translateY(-50%);
1388
+ transition: transform 0.2s;
1227
1389
  }
1228
1390
 
1229
- .r-theme-light:not(.r-theme-system) .r-theme-switcher::before {
1230
- left: 74px;
1391
+ .r-pagination-icon._prev {
1392
+ left: 0;
1393
+ }
1394
+ .r-pagination-item:hover .r-pagination-icon._prev {
1395
+ transform: translate(-4px, -50%);
1396
+ }
1397
+ @media screen and (width >= 1180px) {
1398
+ .r-pagination-item:hover .r-pagination-icon._prev {
1399
+ transform: translate(-8px, -50%);
1400
+ }
1231
1401
  }
1232
1402
 
1233
- .r-theme-switcher-svg {
1234
- display: block;
1235
- }.r-keylink {
1236
- display: block;
1237
- position: relative;
1238
- padding: 8px 12px;
1239
- border: 2px solid var(--r-main-500);
1240
- border-radius: 6px;
1241
- text-decoration: none;
1242
- background: var(--r-main-50);
1403
+ .r-pagination-icon._next {
1404
+ right: 0;
1405
+ }
1406
+ .r-pagination-item:hover .r-pagination-icon._next {
1407
+ transform: translate(4px, -50%);
1408
+ }
1409
+ @media screen and (width >= 1180px) {
1410
+ .r-pagination-item:hover .r-pagination-icon._next {
1411
+ transform: translate(8px, -50%);
1412
+ }
1243
1413
  }
1244
1414
 
1245
- .r-keylink:not(:focus) {
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;
1415
+ .r-pagination-svg {
1416
+ display: block;
1255
1417
  }.r-contents {
1256
1418
  grid-area: contents;
1257
1419
  }
@@ -1491,171 +1653,9 @@
1491
1653
  }
1492
1654
  .r-contents-git:hover {
1493
1655
  color: var(--r-main-900);
1494
- }.r-pagination {
1495
- grid-area: pagination;
1496
- display: grid;
1497
- grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1498
- gap: 16px;
1499
- margin-bottom: 40px;
1500
- }
1501
-
1502
- .r-pagination-item {
1503
- position: relative;
1504
- padding-top: 8px;
1505
- padding-bottom: 8px;
1506
- text-decoration: none;
1507
- font-size: 14px;
1508
- color: var(--r-main-800);
1509
- }
1510
- .r-pagination-item:hover {
1511
- color: var(--r-main-950);
1512
- }
1513
-
1514
- .r-pagination-item._prev {
1515
- padding-left: 28px;
1516
- }
1517
-
1518
- .r-pagination-item._next {
1519
- text-align: right;
1520
- padding-right: 28px;
1521
- }
1522
-
1523
- .r-pagination-text {
1524
- display: block;
1525
- line-height: 2;
1526
- }
1527
-
1528
- .r-pagination-title {
1529
- font-weight: 600;
1530
- font-size: 16px;
1531
- }
1532
-
1533
- .r-pagination-icon {
1534
- position: absolute;
1535
- top: 50%;
1536
- transform: translateY(-50%);
1537
- transition: transform 0.2s;
1538
- }
1539
-
1540
- .r-pagination-icon._prev {
1541
- left: 0;
1542
- }
1543
- .r-pagination-item:hover .r-pagination-icon._prev {
1544
- transform: translate(-4px, -50%);
1545
- }
1546
- @media screen and (width >= 1180px) {
1547
- .r-pagination-item:hover .r-pagination-icon._prev {
1548
- transform: translate(-8px, -50%);
1549
- }
1550
- }
1551
-
1552
- .r-pagination-icon._next {
1553
- right: 0;
1554
- }
1555
- .r-pagination-item:hover .r-pagination-icon._next {
1556
- transform: translate(4px, -50%);
1557
- }
1558
- @media screen and (width >= 1180px) {
1559
- .r-pagination-item:hover .r-pagination-icon._next {
1560
- transform: translate(8px, -50%);
1561
- }
1562
- }
1563
-
1564
- .r-pagination-svg {
1565
- display: block;
1566
- }.r-breadcrumbs {
1567
- grid-area: breadcrumbs;
1568
- list-style: none;
1569
- margin: 0;
1570
- padding: 20px 0 0;
1571
- line-height: 2;
1572
- }
1573
- @media screen and (width >= 768px) {
1574
- .r-breadcrumbs {
1575
- padding: 32px 0 0;
1576
- }
1577
- }
1578
-
1579
- .r-breadcrumb {
1580
- display: inline;
1581
- }
1582
-
1583
- .r-breadcrumb._previous::after {
1584
- content: "/";
1585
- font-weight: 600;
1586
- margin-inline: 8px;
1587
- }
1588
-
1589
- .r-breadcrumb-link {
1590
- color: var(--r-main-700);
1591
- text-decoration: none;
1592
- }
1593
- .r-breadcrumb-link:hover {
1594
- color: var(--r-primary-800);
1595
- }
1596
-
1597
- .r-breadcrumb-link,
1598
- .r-breadcrumb-title {
1599
- display: inline;
1600
- padding: 6px 0;
1601
- margin: 0;
1602
- }
1603
-
1604
- .r-breadcrumb-title {
1605
- color: var(--r-main-950);
1606
- font-weight: 600;
1607
1656
  }.r-last-modified {
1608
1657
  color: var(--r-main-700);
1609
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;
@@ -1809,9 +1809,6 @@
1809
1809
  }
1810
1810
  .r-blockquote-caution .r-blockquote-title {
1811
1811
  color: var(--r-caution);
1812
- }.r-img {
1813
- max-width: 100%;
1814
- box-sizing: border-box;
1815
1812
  }.r-h1 {
1816
1813
  font-size: 32px;
1817
1814
  line-height: 1.4;
@@ -1852,6 +1849,9 @@
1852
1849
  line-height: 1.4;
1853
1850
  margin-block-start: 1.8em;
1854
1851
  margin-block-end: 1.8em;
1852
+ }.r-img {
1853
+ max-width: 100%;
1854
+ box-sizing: border-box;
1855
1855
  }.r-p {
1856
1856
  line-height: 1.8;
1857
1857
  margin-block-start: 1em;
@@ -2072,11 +2072,6 @@
2072
2072
 
2073
2073
  .r-td_right {
2074
2074
  text-align: right;
2075
- }.r-tr {
2076
- border-collapse: collapse;
2077
- }
2078
- .r-tr:not(:first-child) {
2079
- border-top: 1px solid var(--r-main-200);
2080
2075
  }.r-th {
2081
2076
  padding: 8px 12px;
2082
2077
  border-collapse: collapse;
@@ -2103,8 +2098,11 @@
2103
2098
 
2104
2099
  .r-th_right {
2105
2100
  text-align: right;
2106
- }.r-task-ol {
2107
- list-style: none;
2101
+ }.r-tr {
2102
+ border-collapse: collapse;
2103
+ }
2104
+ .r-tr:not(:first-child) {
2105
+ border-top: 1px solid var(--r-main-200);
2108
2106
  }.r-task-li.r-task-li {
2109
2107
  margin-block-start: 2px;
2110
2108
  margin-block-end: 2px;
@@ -2134,6 +2132,8 @@
2134
2132
 
2135
2133
  .r-task-label-text {
2136
2134
  vertical-align: middle;
2135
+ }.r-task-ol {
2136
+ list-style: none;
2137
2137
  }.r-task-ul {
2138
2138
  list-style: none;
2139
2139
  }.r-tooltip {