robindoc 0.0.0-experimental-fd1659a → 0.0.0-experimental-4f05ca6

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 +278 -276
  2. package/package.json +1 -1
package/lib/styles.css CHANGED
@@ -87,41 +87,6 @@
87
87
  width: 100%;
88
88
  left: 0;
89
89
  }
90
- }.r-footer {
91
- border-top: 1px solid var(--r-main-300);
92
- padding-top: 16px;
93
- padding-bottom: 16px;
94
- }
95
-
96
- .r-footer-row {
97
- display: flex;
98
- justify-content: space-between;
99
- align-items: center;
100
- gap: 32px;
101
- }
102
-
103
- .r-footer-additional {
104
- margin-top: 20px;
105
- justify-content: flex-end;
106
- }
107
-
108
- .r-copyright {
109
- color: var(--r-main-800);
110
- }
111
-
112
- .r-powered {
113
- font-size: 14px;
114
- display: block;
115
- color: var(--r-main-600);
116
- }
117
-
118
- .r-powered-link {
119
- font-weight: 600;
120
- text-decoration: none;
121
- color: var(--r-main-950);
122
- }
123
- .r-powered-link:hover {
124
- color: var(--r-primary-900);
125
90
  }.r-root {
126
91
  --r-header-height: 60px;
127
92
  position: relative;
@@ -354,28 +319,6 @@
354
319
  --r-cl-60: #86181d;
355
320
  --r-cl-61: #144620;
356
321
  --r-cl-62: #c24e00;
357
- }.r-docs-container {
358
- min-height: calc(100dvh - var(--r-header-height));
359
- overflow-wrap: break-word;
360
- box-sizing: border-box;
361
- }
362
- @media screen and (width >= 768px) {
363
- .r-docs-container {
364
- display: grid;
365
- justify-content: center;
366
- column-gap: 32px;
367
- grid-template-areas: "sidebar breadcrumbs" "sidebar contents" "sidebar content" "sidebar pagination";
368
- grid-template-columns: 1fr calc(100% - 248px);
369
- grid-template-rows: auto auto 1fr auto;
370
- }
371
- }
372
- @media screen and (width >= 1180px) {
373
- .r-docs-container {
374
- column-gap: 40px;
375
- grid-template-areas: "sidebar breadcrumbs contents" "sidebar content contents" "sidebar pagination contents";
376
- grid-template-columns: 200px 640px 1fr;
377
- grid-template-rows: auto 1fr auto;
378
- }
379
322
  }.r-blog-container {
380
323
  min-height: calc(100dvh - var(--r-header-height));
381
324
  overflow-wrap: break-word;
@@ -399,60 +342,65 @@
399
342
  top: 8px;
400
343
  left: 12px;
401
344
  z-index: 1001;
402
- }.r-keylink.keylink-to-navigation:focus {
403
- margin-top: -40px;
404
- }.r-article {
405
- padding: 20px 0 40px;
406
- grid-area: content;
345
+ }.r-docs-container {
346
+ min-height: calc(100dvh - var(--r-header-height));
347
+ overflow-wrap: break-word;
348
+ box-sizing: border-box;
407
349
  }
408
- @media screen and (width >= 1180px) {
409
- .r-article {
410
- padding: 32px 0 40px;
350
+ @media screen and (width >= 768px) {
351
+ .r-docs-container {
352
+ display: grid;
353
+ justify-content: center;
354
+ column-gap: 32px;
355
+ grid-template-areas: "sidebar breadcrumbs" "sidebar contents" "sidebar content" "sidebar pagination";
356
+ grid-template-columns: 1fr calc(100% - 248px);
357
+ grid-template-rows: auto auto 1fr auto;
411
358
  }
412
359
  }
413
- .r-article > *:first-child {
414
- margin-top: 0;
415
- }
416
- .r-article > *:last-child {
417
- margin-bottom: 0;
360
+ @media screen and (width >= 1180px) {
361
+ .r-docs-container {
362
+ column-gap: 40px;
363
+ grid-template-areas: "sidebar breadcrumbs contents" "sidebar content contents" "sidebar pagination contents";
364
+ grid-template-columns: 200px 640px 1fr;
365
+ grid-template-rows: auto 1fr auto;
366
+ }
367
+ }.r-keylink.keylink-to-navigation:focus {
368
+ margin-top: -40px;
369
+ }.r-footer {
370
+ border-top: 1px solid var(--r-main-300);
371
+ padding-top: 16px;
372
+ padding-bottom: 16px;
418
373
  }
419
374
 
420
- .r-checkbox {
421
- cursor: pointer;
422
- width: 20px;
423
- height: 20px;
424
- margin: 4px;
425
- vertical-align: middle;
426
- box-sizing: border-box;
375
+ .r-footer-row {
376
+ display: flex;
377
+ justify-content: space-between;
378
+ align-items: center;
379
+ gap: 32px;
427
380
  }
428
381
 
429
- .r-label {
430
- cursor: pointer;
382
+ .r-footer-additional {
383
+ margin-top: 20px;
384
+ justify-content: flex-end;
431
385
  }
432
386
 
433
- .r-task-ol,
434
- .r-task-ul {
435
- list-style: none;
387
+ .r-copyright {
388
+ color: var(--r-main-800);
436
389
  }
437
390
 
438
- .r-task-label {
391
+ .r-powered {
392
+ font-size: 14px;
439
393
  display: block;
440
- width: 100%;
441
- padding-top: 2px;
442
- padding-bottom: 2px;
443
- box-sizing: border-box;
444
- }
445
- .r-task-label:hover .r-checkbox {
446
- filter: brightness(0.8);
394
+ color: var(--r-main-600);
447
395
  }
448
396
 
449
- .r-task-li.r-task-li {
450
- margin-block-start: 2px;
451
- margin-block-end: 2px;
397
+ .r-powered-link {
398
+ font-weight: 600;
399
+ text-decoration: none;
400
+ color: var(--r-main-950);
452
401
  }
453
-
454
- .r-label-text {
455
- vertical-align: middle;
402
+ .r-powered-link:hover {
403
+ color: var(--r-primary-900);
456
404
  }.r-sidebar {
457
405
  grid-area: sidebar;
458
406
  box-sizing: border-box;
@@ -725,6 +673,58 @@
725
673
 
726
674
  .r-sidebar-drop[open] > .r-sidebar-drop-btn > .r-sidebar-drop-icon {
727
675
  transform: rotate(90deg);
676
+ }.r-article {
677
+ padding: 20px 0 40px;
678
+ grid-area: content;
679
+ }
680
+ @media screen and (width >= 1180px) {
681
+ .r-article {
682
+ padding: 32px 0 40px;
683
+ }
684
+ }
685
+ .r-article > *:first-child {
686
+ margin-top: 0;
687
+ }
688
+ .r-article > *:last-child {
689
+ margin-bottom: 0;
690
+ }
691
+
692
+ .r-checkbox {
693
+ cursor: pointer;
694
+ width: 20px;
695
+ height: 20px;
696
+ margin: 4px;
697
+ vertical-align: middle;
698
+ box-sizing: border-box;
699
+ }
700
+
701
+ .r-label {
702
+ cursor: pointer;
703
+ }
704
+
705
+ .r-task-ol,
706
+ .r-task-ul {
707
+ list-style: none;
708
+ }
709
+
710
+ .r-task-label {
711
+ display: block;
712
+ width: 100%;
713
+ padding-top: 2px;
714
+ padding-bottom: 2px;
715
+ box-sizing: border-box;
716
+ }
717
+ .r-task-label:hover .r-checkbox {
718
+ filter: brightness(0.8);
719
+ }
720
+
721
+ .r-task-li.r-task-li {
722
+ margin-block-start: 2px;
723
+ margin-block-end: 2px;
724
+ }
725
+
726
+ .r-label-text {
727
+ vertical-align: middle;
728
728
  }.r-header-menu {
729
729
  display: flex;
730
730
  justify-content: flex-end;
@@ -895,7 +895,7 @@
895
895
  }
896
896
 
897
897
  .r-search-results {
898
- padding: 12px 8px 8px;
898
+ padding: 2px 8px 8px;
899
899
  max-height: min(400px, 100dvh - 200px);
900
900
  overflow-y: auto;
901
901
  list-style: none;
@@ -918,7 +918,8 @@
918
918
  }
919
919
  .r-search-item:hover, .r-search-item:focus {
920
920
  color: var(--r-main-950);
921
- background-color: var(--r-main-50);
921
+ background-color: var(--r-main-100);
922
+ border-color: var(--r-main-200);
922
923
  }
923
924
 
924
925
  .r-search-item-title {
@@ -1033,6 +1034,26 @@
1033
1034
  margin-right: auto;
1034
1035
  margin-left: auto;
1035
1036
  box-sizing: border-box;
1037
+ }.r-keylink {
1038
+ display: block;
1039
+ position: relative;
1040
+ padding: 8px 12px;
1041
+ border: 2px solid var(--r-main-500);
1042
+ border-radius: 6px;
1043
+ text-decoration: none;
1044
+ background: var(--r-main-50);
1045
+ }
1046
+
1047
+ .r-keylink:not(:focus) {
1048
+ width: 1px !important;
1049
+ height: 1px !important;
1050
+ padding: 0 !important;
1051
+ overflow: hidden !important;
1052
+ clip: rect(1px, 1px, 1px, 1px) !important;
1053
+ border: 0 !important;
1054
+ user-select: none;
1055
+ pointer-events: none;
1056
+ box-sizing: border-box;
1036
1057
  }.r-theme-switcher {
1037
1058
  position: relative;
1038
1059
  display: flex;
@@ -1104,39 +1125,135 @@
1104
1125
 
1105
1126
  .r-theme-switcher-svg {
1106
1127
  display: block;
1107
- }.r-keylink {
1108
- display: block;
1109
- position: relative;
1110
- padding: 8px 12px;
1111
- border: 2px solid var(--r-main-500);
1112
- border-radius: 6px;
1113
- text-decoration: none;
1114
- background: var(--r-main-50);
1128
+ }.r-breadcrumbs {
1129
+ grid-area: breadcrumbs;
1130
+ list-style: none;
1131
+ margin: 0;
1132
+ padding: 20px 0 0;
1133
+ line-height: 2;
1115
1134
  }
1116
-
1117
- .r-keylink:not(:focus) {
1118
- width: 1px !important;
1119
- height: 1px !important;
1120
- padding: 0 !important;
1121
- overflow: hidden !important;
1122
- clip: rect(1px, 1px, 1px, 1px) !important;
1123
- border: 0 !important;
1124
- user-select: none;
1125
- pointer-events: none;
1126
- box-sizing: border-box;
1127
- }.r-contents {
1128
- grid-area: contents;
1135
+ @media screen and (width >= 768px) {
1136
+ .r-breadcrumbs {
1137
+ padding: 32px 0 0;
1138
+ }
1129
1139
  }
1130
1140
 
1131
- .r-contents-sticky {
1132
- position: sticky;
1133
- top: var(--r-header-height);
1134
- width: 100%;
1135
- box-sizing: border-box;
1141
+ .r-breadcrumb {
1142
+ display: inline;
1136
1143
  }
1137
- @media screen and (width >= 1180px) {
1138
- .r-contents-sticky {
1139
- padding: 0 12px;
1144
+
1145
+ .r-breadcrumb._previous::after {
1146
+ content: "/";
1147
+ font-weight: 600;
1148
+ margin-inline: 8px;
1149
+ }
1150
+
1151
+ .r-breadcrumb-link {
1152
+ color: var(--r-main-700);
1153
+ text-decoration: none;
1154
+ }
1155
+ .r-breadcrumb-link:hover {
1156
+ color: var(--r-primary-800);
1157
+ }
1158
+
1159
+ .r-breadcrumb-link,
1160
+ .r-breadcrumb-title {
1161
+ display: inline;
1162
+ padding: 6px 0;
1163
+ margin: 0;
1164
+ }
1165
+
1166
+ .r-breadcrumb-title {
1167
+ color: var(--r-main-950);
1168
+ font-weight: 600;
1169
+ }.r-pagination {
1170
+ grid-area: pagination;
1171
+ display: grid;
1172
+ grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1173
+ gap: 16px;
1174
+ margin-bottom: 40px;
1175
+ }
1176
+
1177
+ .r-pagination-item {
1178
+ position: relative;
1179
+ padding-top: 8px;
1180
+ padding-bottom: 8px;
1181
+ text-decoration: none;
1182
+ font-size: 14px;
1183
+ color: var(--r-main-800);
1184
+ }
1185
+ .r-pagination-item:hover {
1186
+ color: var(--r-main-950);
1187
+ }
1188
+
1189
+ .r-pagination-item._prev {
1190
+ padding-left: 28px;
1191
+ }
1192
+
1193
+ .r-pagination-item._next {
1194
+ text-align: right;
1195
+ padding-right: 28px;
1196
+ }
1197
+
1198
+ .r-pagination-text {
1199
+ display: block;
1200
+ line-height: 2;
1201
+ }
1202
+
1203
+ .r-pagination-title {
1204
+ font-weight: 600;
1205
+ font-size: 16px;
1206
+ }
1207
+
1208
+ .r-pagination-icon {
1209
+ position: absolute;
1210
+ top: 50%;
1211
+ transform: translateY(-50%);
1212
+ transition: transform 0.2s;
1213
+ }
1214
+
1215
+ .r-pagination-icon._prev {
1216
+ left: 0;
1217
+ }
1218
+ .r-pagination-item:hover .r-pagination-icon._prev {
1219
+ transform: translate(-4px, -50%);
1220
+ }
1221
+ @media screen and (width >= 1180px) {
1222
+ .r-pagination-item:hover .r-pagination-icon._prev {
1223
+ transform: translate(-8px, -50%);
1224
+ }
1225
+ }
1226
+
1227
+ .r-pagination-icon._next {
1228
+ right: 0;
1229
+ }
1230
+ .r-pagination-item:hover .r-pagination-icon._next {
1231
+ transform: translate(4px, -50%);
1232
+ }
1233
+ @media screen and (width >= 1180px) {
1234
+ .r-pagination-item:hover .r-pagination-icon._next {
1235
+ transform: translate(8px, -50%);
1236
+ }
1237
+ }
1238
+
1239
+ .r-pagination-svg {
1240
+ display: block;
1241
+ }.r-last-modified {
1242
+ color: var(--r-main-700);
1243
+ margin-block-start: 16px;
1244
+ }.r-contents {
1245
+ grid-area: contents;
1246
+ }
1247
+
1248
+ .r-contents-sticky {
1249
+ position: sticky;
1250
+ top: var(--r-header-height);
1251
+ width: 100%;
1252
+ box-sizing: border-box;
1253
+ }
1254
+ @media screen and (width >= 1180px) {
1255
+ .r-contents-sticky {
1256
+ padding: 0 12px;
1140
1257
  max-height: calc(100dvh - var(--r-header-height));
1141
1258
  overflow: auto;
1142
1259
  scrollbar-width: thin;
@@ -1357,122 +1474,6 @@
1357
1474
  }
1358
1475
  .r-contents-git:hover {
1359
1476
  color: var(--r-main-900);
1360
- }.r-breadcrumbs {
1361
- grid-area: breadcrumbs;
1362
- list-style: none;
1363
- margin: 0;
1364
- padding: 20px 0 0;
1365
- line-height: 2;
1366
- }
1367
- @media screen and (width >= 768px) {
1368
- .r-breadcrumbs {
1369
- padding: 32px 0 0;
1370
- }
1371
- }
1372
-
1373
- .r-breadcrumb {
1374
- display: inline;
1375
- }
1376
-
1377
- .r-breadcrumb._previous::after {
1378
- content: "/";
1379
- font-weight: 600;
1380
- margin-inline: 8px;
1381
- }
1382
-
1383
- .r-breadcrumb-link {
1384
- color: var(--r-main-700);
1385
- text-decoration: none;
1386
- }
1387
- .r-breadcrumb-link:hover {
1388
- color: var(--r-primary-800);
1389
- }
1390
-
1391
- .r-breadcrumb-link,
1392
- .r-breadcrumb-title {
1393
- display: inline;
1394
- padding: 6px 0;
1395
- margin: 0;
1396
- }
1397
-
1398
- .r-breadcrumb-title {
1399
- color: var(--r-main-950);
1400
- font-weight: 600;
1401
- }.r-pagination {
1402
- grid-area: pagination;
1403
- display: grid;
1404
- grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1405
- gap: 16px;
1406
- margin-bottom: 40px;
1407
- }
1408
-
1409
- .r-pagination-item {
1410
- position: relative;
1411
- padding-top: 8px;
1412
- padding-bottom: 8px;
1413
- text-decoration: none;
1414
- font-size: 14px;
1415
- color: var(--r-main-800);
1416
- }
1417
- .r-pagination-item:hover {
1418
- color: var(--r-main-950);
1419
- }
1420
-
1421
- .r-pagination-item._prev {
1422
- padding-left: 28px;
1423
- }
1424
-
1425
- .r-pagination-item._next {
1426
- text-align: right;
1427
- padding-right: 28px;
1428
- }
1429
-
1430
- .r-pagination-text {
1431
- display: block;
1432
- line-height: 2;
1433
- }
1434
-
1435
- .r-pagination-title {
1436
- font-weight: 600;
1437
- font-size: 16px;
1438
- }
1439
-
1440
- .r-pagination-icon {
1441
- position: absolute;
1442
- top: 50%;
1443
- transform: translateY(-50%);
1444
- transition: transform 0.2s;
1445
- }
1446
-
1447
- .r-pagination-icon._prev {
1448
- left: 0;
1449
- }
1450
- .r-pagination-item:hover .r-pagination-icon._prev {
1451
- transform: translate(-4px, -50%);
1452
- }
1453
- @media screen and (width >= 1180px) {
1454
- .r-pagination-item:hover .r-pagination-icon._prev {
1455
- transform: translate(-8px, -50%);
1456
- }
1457
- }
1458
-
1459
- .r-pagination-icon._next {
1460
- right: 0;
1461
- }
1462
- .r-pagination-item:hover .r-pagination-icon._next {
1463
- transform: translate(4px, -50%);
1464
- }
1465
- @media screen and (width >= 1180px) {
1466
- .r-pagination-item:hover .r-pagination-icon._next {
1467
- transform: translate(8px, -50%);
1468
- }
1469
- }
1470
-
1471
- .r-pagination-svg {
1472
- display: block;
1473
- }.r-last-modified {
1474
- color: var(--r-main-700);
1475
- margin-block-start: 16px;
1476
1477
  }.r-git-logo {
1477
1478
  display: block;
1478
1479
  }.r-external-mark {
@@ -1576,6 +1577,14 @@
1576
1577
 
1577
1578
  .r-code-section-filename {
1578
1579
  font-family: var(--monospace-font, monospace, monospace);
1580
+ }.r-block {
1581
+ width: 100%;
1582
+ overflow: auto;
1583
+ margin-block-start: 12px;
1584
+ margin-block-end: 12px;
1585
+ scrollbar-width: thin;
1586
+ scrollbar-color: var(--r-main-200) transparent;
1587
+ box-sizing: border-box;
1579
1588
  }.r-blockquote {
1580
1589
  background-color: var(--r-main-100);
1581
1590
  padding: 8px 12px 8px 20px;
@@ -1646,19 +1655,6 @@
1646
1655
 
1647
1656
  .r-code-span + .r-content-link-external {
1648
1657
  margin-left: -12px;
1649
- }.r-code-block {
1650
- font-family: var(--monospace-font, monospace, monospace);
1651
- font-size: 16px;
1652
- line-height: 1.33;
1653
- border-radius: 6px;
1654
- padding: 16px 20px;
1655
- margin: 0;
1656
- color: var(--r-primary-800);
1657
- background-color: var(--r-main-50);
1658
- overflow-x: auto;
1659
- scrollbar-width: thin;
1660
- scrollbar-color: var(--r-main-200) transparent;
1661
- box-sizing: border-box;
1662
1658
  }.r-h1 {
1663
1659
  font-size: 32px;
1664
1660
  line-height: 1.4;
@@ -1702,18 +1698,23 @@
1702
1698
  }.r-img {
1703
1699
  max-width: 100%;
1704
1700
  box-sizing: border-box;
1705
- }.r-block {
1706
- width: 100%;
1707
- overflow: auto;
1708
- margin-block-start: 12px;
1709
- margin-block-end: 12px;
1710
- scrollbar-width: thin;
1711
- scrollbar-color: var(--r-main-200) transparent;
1712
- box-sizing: border-box;
1713
1701
  }.r-p {
1714
1702
  line-height: 1.8;
1715
1703
  margin-block-start: 1em;
1716
1704
  margin-block-end: 1em;
1705
+ }.r-code-block {
1706
+ font-family: var(--monospace-font, monospace, monospace);
1707
+ font-size: 16px;
1708
+ line-height: 1.33;
1709
+ border-radius: 6px;
1710
+ padding: 16px 20px;
1711
+ margin: 0;
1712
+ color: var(--r-primary-800);
1713
+ background-color: var(--r-main-50);
1714
+ overflow-x: auto;
1715
+ scrollbar-width: thin;
1716
+ scrollbar-color: var(--r-main-200) transparent;
1717
+ box-sizing: border-box;
1717
1718
  }.r-tabs {
1718
1719
  margin-block-start: 1.5em;
1719
1720
  margin-block-end: 1.75em;
@@ -1755,14 +1756,6 @@
1755
1756
 
1756
1757
  .r-tab-header-code {
1757
1758
  font-family: var(--monospace-font, monospace, monospace);
1758
- }.r-kbd-container {
1759
- display: flex;
1760
- gap: 4px;
1761
- font-size: 14px;
1762
- cursor: pointer;
1763
- }
1764
- .r-kbd-container:hover {
1765
- color: var(--r-main-950);
1766
1759
  }.r-kbd-key {
1767
1760
  background-color: var(--r-main-200);
1768
1761
  font-size: 12px;
@@ -1771,12 +1764,21 @@
1771
1764
  min-width: 24px;
1772
1765
  text-align: center;
1773
1766
  box-sizing: border-box;
1767
+ }.r-kbd-container {
1768
+ display: flex;
1769
+ gap: 4px;
1770
+ font-size: 14px;
1771
+ cursor: pointer;
1772
+ }
1773
+ .r-kbd-container:hover {
1774
+ color: var(--r-main-950);
1774
1775
  }.r-modal {
1775
1776
  position: fixed;
1776
1777
  left: 0;
1777
1778
  bottom: 0;
1778
1779
  width: 100%;
1779
- background-color: var(--r-main-50);
1780
+ background-color: color-mix(in srgb, var(--r-main-50) 95%, transparent);
1781
+ border: 2px solid var(--r-main-200);
1780
1782
  border-radius: 12px 12px 0 0;
1781
1783
  opacity: 0;
1782
1784
  visibility: hidden;
@@ -2000,18 +2002,18 @@
2000
2002
  right: 0;
2001
2003
  bottom: 0;
2002
2004
  left: 0;
2003
- background: rgba(0, 0, 0, 0);
2005
+ background: color-mix(in srgb, var(--r-main-900) 0%, transparent 100%);
2004
2006
  opacity: 0;
2005
2007
  visibility: hidden;
2006
2008
  pointer-events: none;
2007
- backdrop-filter: blur(1px);
2009
+ backdrop-filter: blur(4px);
2008
2010
  transition: background 0.05s, opacity 0.2s, visibility 0.01s 0.15s;
2009
2011
  z-index: 100;
2010
2012
  }
2011
2013
 
2012
2014
  .r-backdrop._visible {
2013
2015
  opacity: 1;
2014
- background: rgba(0, 0, 0, 0.3);
2016
+ background: color-mix(in srgb, var(--r-main-900) 10%, transparent 100%);
2015
2017
  visibility: visible;
2016
2018
  transition: background 0.05s, opacity 0.2s;
2017
2019
  pointer-events: all;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "robindoc",
3
- "version": "0.0.0-experimental-fd1659a",
3
+ "version": "0.0.0-experimental-4f05ca6",
4
4
  "description": "Robindoc is a framework for automatically creating documentation websites based on markdown files, built on React.js Server Components",
5
5
  "main": "./lib/index.js",
6
6
  "scripts": {