@janga/norna 0.7.23 → 0.7.24

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 (71) hide show
  1. package/README.md +14 -18
  2. package/astro.config.mjs +12 -0
  3. package/bin/norna-cli.mjs +6 -0
  4. package/package.json +13 -2
  5. package/schemas/category.schema.json +2 -2
  6. package/schemas/config.schema.json +45 -15
  7. package/schemas/content-frontmatter.schema.json +7 -7
  8. package/schemas/page-theme.schema.json +26 -26
  9. package/schemas/sitewide-content.schema.json +18 -18
  10. package/schemas/theme.schema.json +246 -246
  11. package/scripts/build-site.mjs +1 -0
  12. package/scripts/check-config.mjs +12 -1
  13. package/scripts/generate-search-index.mjs +57 -0
  14. package/scripts/init-site.mjs +1 -0
  15. package/scripts/lib/code-fence-metadata.mjs +223 -0
  16. package/scripts/lib/edit-source-link.mjs +49 -0
  17. package/scripts/lib/editor-language-service.mjs +32 -12
  18. package/scripts/lib/image-presentation.mjs +4 -0
  19. package/scripts/lib/navigation-model.mjs +34 -13
  20. package/scripts/lib/navigation-review.mjs +396 -0
  21. package/scripts/lib/norna-markdown-blocks.mjs +73 -26
  22. package/scripts/lib/norna-markdown-render-plugin.mjs +64 -1
  23. package/scripts/lib/page-aliases.mjs +21 -1
  24. package/scripts/lib/page-markdown.mjs +32 -1
  25. package/scripts/lib/page-move-plan.mjs +659 -0
  26. package/scripts/lib/presentation-palette-metadata.mjs +1 -1
  27. package/scripts/lib/presentation.mjs +1 -10
  28. package/scripts/lib/project-config.mjs +111 -5
  29. package/scripts/lib/public-asset-conventions.mjs +36 -2
  30. package/scripts/lib/schema-definitions.mjs +22 -5
  31. package/scripts/lib/schema-editor-metadata.mjs +19 -4
  32. package/scripts/lib/schema-value-definitions.mjs +1 -1
  33. package/scripts/lib/semantic-callouts.mjs +128 -0
  34. package/scripts/lib/site-content.mjs +2 -1
  35. package/scripts/lib/site-link-graph.mjs +33 -2
  36. package/scripts/lib/site-navigation-tree.mjs +85 -0
  37. package/scripts/lib/social-image-assets.mjs +30 -0
  38. package/scripts/lib/theme-presets.mjs +2 -2
  39. package/scripts/lib/theme-profiles.mjs +0 -4
  40. package/scripts/move-site-page.mjs +256 -0
  41. package/scripts/review-navigation.mjs +32 -0
  42. package/scripts/sync-content-sections.mjs +67 -4
  43. package/scripts/sync-site-public.mjs +24 -5
  44. package/src/components/CodeBlockCopyScript.astro +9 -4
  45. package/src/components/EditSourceLink.astro +17 -0
  46. package/src/components/ImageCarousel.astro +5 -6
  47. package/src/components/NavigationPageTree.astro +66 -55
  48. package/src/components/NavigationTreeControls.astro +77 -0
  49. package/src/components/PageAliasRedirect.astro +1 -1
  50. package/src/components/PageList.astro +33 -0
  51. package/src/components/PageSequenceNavigation.astro +37 -0
  52. package/src/components/SearchPage.astro +151 -0
  53. package/src/components/SiteNavigation.astro +35 -8
  54. package/src/components/SitePage.astro +79 -26
  55. package/src/components/SiteSection.astro +11 -3
  56. package/src/components/SiteTreeNavigation.astro +8 -1
  57. package/src/components/TreeNavigationScript.astro +207 -26
  58. package/src/layouts/BaseLayout.astro +57 -2
  59. package/src/lib/sectionContent.ts +32 -3
  60. package/src/lib/siteNavigation.ts +31 -52
  61. package/src/lib/sitePublicAssets.ts +1 -0
  62. package/src/pages/404.astro +110 -0
  63. package/src/pages/[...slug].astro +15 -5
  64. package/src/styles/content.css +242 -18
  65. package/src/styles/media.css +0 -5
  66. package/src/styles/navigation.css +31 -0
  67. package/src/styles/page-layout.css +438 -89
  68. package/src/styles/responsive.css +77 -8
  69. package/starters/basic/README.md +6 -19
  70. package/starters/basic/package.json +1 -0
  71. package/starters/basic/site/pages/000-home/content.md +13 -50
@@ -35,6 +35,37 @@
35
35
  margin-left: auto;
36
36
  }
37
37
 
38
+ .site-search-link {
39
+ display: grid;
40
+ place-items: center;
41
+ flex: 0 0 auto;
42
+ width: 2.25rem;
43
+ height: 2.25rem;
44
+ border: 1px solid color-mix(in srgb, currentColor 38%, transparent);
45
+ border-radius: 50%;
46
+ color: currentColor;
47
+ text-decoration: none;
48
+ transition: border-color 0.18s ease, background-color 0.18s ease;
49
+ }
50
+
51
+ .site-search-link:hover,
52
+ .site-search-link[aria-current='page'] {
53
+ border-color: currentColor;
54
+ background: color-mix(in srgb, currentColor 9%, transparent);
55
+ }
56
+
57
+ .site-search-link:focus-visible {
58
+ outline: var(--focus-indicator-width) solid var(--color-focus-ring);
59
+ outline-offset: 2px;
60
+ }
61
+
62
+ .site-search-link svg {
63
+ display: block;
64
+ width: 1.05rem;
65
+ height: 1.05rem;
66
+ stroke-width: 2;
67
+ }
68
+
38
69
  .site-nav-leading {
39
70
  display: flex;
40
71
  align-items: center;
@@ -49,16 +49,142 @@
49
49
  }
50
50
 
51
51
  .tree-local-navigation {
52
+ --tree-disclosure-icon-width: 0.9rem;
53
+ --tree-disclosure-gap: 0.6rem;
54
+ --tree-disclosure-offset: calc(var(--tree-disclosure-icon-width) + var(--tree-disclosure-gap));
55
+ --tree-current-item-background: color-mix(
56
+ in srgb,
57
+ var(--color-surface-soft-background) 58%,
58
+ var(--color-page)
59
+ );
52
60
  position: sticky;
53
61
  top: calc(var(--site-top-anchor-offset) + 1.25rem);
54
62
  z-index: 3;
55
63
  min-height: 0;
56
64
  max-height: calc(100svh - var(--site-top-anchor-offset) - 2.5rem);
57
65
  border-inline-end: 1px solid var(--color-nav-separator);
58
- padding: 1.5rem 0;
66
+ padding: 1.25rem 0.75rem 1.25rem 0.35rem;
59
67
  background: var(--color-page);
60
68
  overflow-y: auto;
61
69
  overscroll-behavior: contain;
70
+ scrollbar-gutter: stable;
71
+ }
72
+
73
+ .navigation-tree-controls {
74
+ position: sticky;
75
+ top: 0;
76
+ z-index: 4;
77
+ display: grid;
78
+ grid-template-columns: minmax(0, 1fr) auto;
79
+ gap: 0.45rem;
80
+ margin: 0 0 0.85rem;
81
+ border-bottom: 1px solid var(--color-nav-separator);
82
+ padding: 0 0 0.75rem;
83
+ background: var(--color-page);
84
+ }
85
+
86
+ .navigation-tree-filter {
87
+ position: relative;
88
+ grid-column: 1 / -1;
89
+ display: flex;
90
+ align-items: center;
91
+ }
92
+
93
+ .navigation-tree-filter > svg {
94
+ position: absolute;
95
+ left: 0.55rem;
96
+ width: 0.95rem;
97
+ height: 0.95rem;
98
+ pointer-events: none;
99
+ opacity: 0.62;
100
+ }
101
+
102
+ .navigation-tree-filter > input {
103
+ min-width: 0;
104
+ width: 100%;
105
+ min-height: 2.15rem;
106
+ border: 1px solid var(--color-border);
107
+ border-radius: var(--corner-radius-small, 2px);
108
+ padding: 0.4rem 0.55rem 0.4rem 1.85rem;
109
+ background: var(--color-page);
110
+ color: var(--color-primary-text);
111
+ font: inherit;
112
+ font-size: 0.78rem;
113
+ letter-spacing: 0;
114
+ }
115
+
116
+ .navigation-tree-filter > input::placeholder {
117
+ color: var(--color-secondary-text);
118
+ opacity: 0.8;
119
+ }
120
+
121
+ .navigation-tree-filter > input:focus-visible {
122
+ outline: 2px solid var(--color-focus-ring);
123
+ outline-offset: 2px;
124
+ }
125
+
126
+ .navigation-tree-commands {
127
+ grid-column: 1 / -1;
128
+ display: flex;
129
+ justify-content: flex-end;
130
+ gap: 0.35rem;
131
+ }
132
+
133
+ .navigation-tree-commands > button {
134
+ display: grid;
135
+ place-items: center;
136
+ width: 2.15rem;
137
+ height: 2.15rem;
138
+ border: 1px solid var(--color-border);
139
+ border-radius: var(--corner-radius-small, 2px);
140
+ padding: 0;
141
+ background: var(--color-page);
142
+ color: var(--color-secondary-text);
143
+ cursor: pointer;
144
+ }
145
+
146
+ .navigation-tree-commands > button:hover,
147
+ .navigation-tree-commands > button:focus-visible {
148
+ background: var(--color-surface-soft-background);
149
+ color: var(--color-primary-text);
150
+ }
151
+
152
+ .navigation-tree-commands > button:focus-visible {
153
+ outline: 2px solid var(--color-focus-ring);
154
+ outline-offset: 2px;
155
+ }
156
+
157
+ .navigation-tree-commands > button:disabled {
158
+ cursor: not-allowed;
159
+ opacity: 0.38;
160
+ }
161
+
162
+ .navigation-tree-commands svg {
163
+ width: 1rem;
164
+ height: 1rem;
165
+ }
166
+
167
+ .navigation-tree-filter-empty {
168
+ grid-column: 1 / -1;
169
+ margin: 0.2rem 0 0;
170
+ color: var(--color-secondary-text);
171
+ font-size: 0.75rem;
172
+ line-height: 1.4;
173
+ }
174
+
175
+ [data-tree-filter-active='true'] .navigation-page-sections,
176
+ [data-tree-filter-active='true'] .navigation-page-sections-disclosure {
177
+ display: none;
178
+ }
179
+
180
+ :root[data-appearance='dark'] .tree-local-navigation {
181
+ --tree-current-item-background: var(--color-surface-soft-background);
182
+ }
183
+
184
+ @media (prefers-color-scheme: dark) {
185
+ :root[data-appearance='system'] .tree-local-navigation {
186
+ --tree-current-item-background: var(--color-surface-soft-background);
187
+ }
62
188
  }
63
189
 
64
190
  .page-contents-navigation {
@@ -111,9 +237,44 @@
111
237
  }
112
238
 
113
239
  .navigation-page-sections {
114
- margin: 0.15rem 0 0.55rem 0.3rem;
115
- border-left: 2px solid color-mix(in srgb, currentColor 38%, transparent);
116
- padding: 0.2rem 0 0.25rem 0.85rem;
240
+ margin: 0.1rem 0 0.45rem 0.25rem;
241
+ border-left: 1px solid color-mix(in srgb, currentColor 26%, transparent);
242
+ padding: 0.15rem 0 0.2rem 0.75rem;
243
+ }
244
+
245
+ .navigation-page-tree-sidebar
246
+ .navigation-page-sections-disclosure > .navigation-page-sections {
247
+ margin-inline-start: var(--tree-disclosure-offset);
248
+ }
249
+
250
+ .navigation-page-sections-disclosure > summary {
251
+ position: absolute;
252
+ top: 0;
253
+ left: 0;
254
+ display: grid;
255
+ place-items: center;
256
+ width: var(--tree-disclosure-offset);
257
+ height: 1.95rem;
258
+ border: 0;
259
+ border-radius: var(--corner-radius-small, 2px);
260
+ list-style: none;
261
+ cursor: pointer;
262
+ color: var(--color-secondary-text);
263
+ }
264
+
265
+ .navigation-page-sections-disclosure > summary::-webkit-details-marker {
266
+ display: none;
267
+ }
268
+
269
+ .navigation-page-sections-disclosure > summary:hover,
270
+ .navigation-page-sections-disclosure > summary:focus-visible {
271
+ background: color-mix(in srgb, currentColor 8%, transparent);
272
+ color: var(--color-primary-text);
273
+ }
274
+
275
+ .navigation-page-sections-disclosure[open]
276
+ > summary .navigation-page-chevron::before {
277
+ transform: rotate(90deg);
117
278
  }
118
279
 
119
280
  .navigation-page-tree,
@@ -127,67 +288,53 @@
127
288
  position: relative;
128
289
  }
129
290
 
291
+ .navigation-page-node[hidden] {
292
+ display: none !important;
293
+ }
294
+
130
295
  .navigation-page-tree-sidebar .navigation-page-link {
131
296
  display: block;
132
- padding: 0.45rem 2rem 0.45rem 0;
297
+ border-radius: var(--corner-radius-small, 2px);
298
+ padding: 0.375rem 0.3rem 0.375rem var(--tree-disclosure-offset);
133
299
  color: var(--color-secondary-text);
134
- font-size: 0.86rem;
135
- line-height: 1.35;
300
+ font-size: 0.84rem;
301
+ font-weight: 400;
302
+ line-height: 1.4;
136
303
  text-decoration: none;
137
304
  }
138
305
 
139
- .navigation-page-tree-sidebar > .navigation-page-node > .navigation-page-link {
306
+ .tree-local-navigation
307
+ > nav
308
+ > .navigation-page-tree-sidebar
309
+ > .navigation-page-node
310
+ > .navigation-page-link {
140
311
  color: var(--color-primary-text);
141
- font-size: 0.94rem;
142
- font-weight: 700;
312
+ font-size: 0.9rem;
313
+ font-weight: 650;
143
314
  }
144
315
 
145
316
  .navigation-page-tree-sidebar .navigation-page-link:hover,
146
- .navigation-page-tree-sidebar .navigation-page-link:focus-visible,
147
- .navigation-page-tree-sidebar .navigation-page-link[aria-current='page'] {
317
+ .navigation-page-tree-sidebar .navigation-page-link:focus-visible {
318
+ background: color-mix(in srgb, var(--color-surface-soft-background) 68%, transparent);
148
319
  color: var(--color-primary-text);
149
320
  text-decoration: underline;
150
321
  text-decoration-thickness: 1px;
151
322
  text-underline-offset: 0.28em;
152
323
  }
153
324
 
154
- .navigation-page-tree-sidebar .navigation-page-tree-sidebar {
155
- margin: 0.25rem 0 0.25rem 0.3rem;
156
- border-left: 1px solid color-mix(in srgb, currentColor 18%, transparent);
157
- padding-left: 0.85rem;
158
- }
159
-
160
- .navigation-page-branch:not(.navigation-page-disclosure) > summary {
161
- position: absolute;
162
- top: 0.25rem;
163
- right: 0;
164
- display: grid;
165
- place-items: center;
166
- width: 1.8rem;
167
- height: 1.8rem;
168
- border: 0;
169
- border-radius: var(--corner-radius-small, 2px);
170
- list-style: none;
171
- cursor: pointer;
172
- color: var(--color-secondary-text);
173
- }
174
-
175
- .navigation-page-branch:not(.navigation-page-disclosure) > summary::-webkit-details-marker {
176
- display: none;
177
- }
178
-
179
- .navigation-page-branch:not(.navigation-page-disclosure) > summary:hover,
180
- .navigation-page-branch:not(.navigation-page-disclosure) > summary:focus-visible {
181
- background: color-mix(in srgb, currentColor 8%, transparent);
325
+ .navigation-page-tree-sidebar .navigation-page-link[aria-current='page'] {
326
+ background: var(--tree-current-item-background);
182
327
  color: var(--color-primary-text);
328
+ font-weight: 650;
329
+ text-decoration: underline;
330
+ text-decoration-thickness: 1px;
331
+ text-underline-offset: 0.28em;
183
332
  }
184
333
 
185
- .navigation-page-branch:not(.navigation-page-disclosure) > summary > [aria-hidden='true']::before {
186
- content: "+";
187
- }
188
-
189
- .navigation-page-branch:not(.navigation-page-disclosure)[open] > summary > [aria-hidden='true']::before {
190
- content: "−";
334
+ .navigation-page-tree-sidebar .navigation-page-tree-sidebar {
335
+ margin: 0.15rem 0 0.2rem 0.25rem;
336
+ border-left: 1px solid color-mix(in srgb, currentColor 16%, transparent);
337
+ padding-left: 0.75rem;
191
338
  }
192
339
 
193
340
  .navigation-page-disclosure > .navigation-page-summary {
@@ -197,9 +344,10 @@
197
344
  width: 100%;
198
345
  border: 0;
199
346
  border-radius: var(--corner-radius-small, 2px);
200
- padding: 0.45rem 0;
201
- font-size: 0.86rem;
202
- line-height: 1.35;
347
+ padding: 0.375rem 0.3rem 0.375rem 0;
348
+ font-size: 0.84rem;
349
+ font-weight: 400;
350
+ line-height: 1.4;
203
351
  list-style: none;
204
352
  cursor: pointer;
205
353
  color: var(--color-secondary-text);
@@ -215,34 +363,91 @@
215
363
  position: relative;
216
364
  }
217
365
 
218
- .navigation-page-disclosure-sidebar {
366
+ .navigation-page-disclosure-sidebar.navigation-category-disclosure {
219
367
  display: grid;
220
368
  grid-template-columns: minmax(0, 1fr);
221
369
  }
222
370
 
223
- .navigation-page-disclosure-sidebar > .navigation-page-summary,
224
- .navigation-page-disclosure-sidebar > .navigation-page-open-link {
371
+ .navigation-page-disclosure-sidebar.navigation-category-disclosure
372
+ > .navigation-page-summary {
373
+ display: grid;
374
+ grid-template-columns: var(--tree-disclosure-icon-width) minmax(0, 1fr);
375
+ column-gap: var(--tree-disclosure-gap);
376
+ justify-content: normal;
377
+ }
378
+
379
+ .navigation-page-disclosure-sidebar.navigation-category-disclosure
380
+ > .navigation-page-summary > .navigation-page-summary-title {
381
+ grid-column: 2;
382
+ width: auto;
383
+ }
384
+
385
+ .navigation-page-disclosure-sidebar.navigation-category-disclosure
386
+ > .navigation-page-summary > .navigation-page-chevron {
225
387
  grid-column: 1;
226
388
  grid-row: 1;
389
+ display: grid;
390
+ place-items: center;
391
+ width: var(--tree-disclosure-icon-width);
392
+ height: 1.35em;
393
+ }
394
+
395
+ .navigation-page-node-page-disclosure {
396
+ display: grid;
397
+ grid-template-columns: var(--tree-disclosure-offset) minmax(0, 1fr);
227
398
  }
228
399
 
229
- .navigation-page-disclosure-sidebar > .navigation-page-open-link {
230
- z-index: 1;
400
+ .navigation-page-node-page-disclosure
401
+ > .navigation-page-disclosure
402
+ > .navigation-page-summary {
403
+ grid-column: 1;
404
+ grid-row: 1;
405
+ display: grid;
406
+ place-items: center;
407
+ width: 100%;
408
+ min-height: 1.95rem;
409
+ padding: 0;
231
410
  }
232
411
 
233
- .navigation-page-disclosure-sidebar > .navigation-page-branch-content {
412
+ .navigation-page-node-page-disclosure > .navigation-page-disclosure {
234
413
  grid-column: 1;
414
+ grid-row: 1;
415
+ }
416
+
417
+ .navigation-page-node-page-disclosure > .navigation-page-open-link {
418
+ grid-column: 2;
419
+ grid-row: 1;
420
+ }
421
+
422
+ .navigation-page-node-page-disclosure > .navigation-page-branch-content {
423
+ grid-column: 1 / -1;
235
424
  grid-row: 2;
236
425
  }
237
426
 
427
+ .navigation-page-node-page-disclosure
428
+ > .navigation-page-disclosure:not([open])
429
+ ~ .navigation-page-branch-content {
430
+ display: none;
431
+ }
432
+
238
433
  .navigation-page-disclosure > .navigation-page-summary::-webkit-details-marker {
239
434
  display: none;
240
435
  }
241
436
 
242
437
  .navigation-page-disclosure > .navigation-page-summary:hover,
243
- .navigation-page-disclosure > .navigation-page-summary:focus-visible,
438
+ .navigation-page-disclosure > .navigation-page-summary:focus-visible {
439
+ background: color-mix(in srgb, var(--color-surface-soft-background) 68%, transparent);
440
+ color: var(--color-primary-text);
441
+ }
442
+
244
443
  .navigation-page-disclosure[data-current-page='true'] > .navigation-page-summary {
444
+ background: var(--tree-current-item-background);
245
445
  color: var(--color-primary-text);
446
+ font-weight: 650;
447
+ }
448
+
449
+ .navigation-page-disclosure[data-current-page='true'] + .navigation-page-open-link {
450
+ background: var(--tree-current-item-background);
246
451
  }
247
452
 
248
453
  .navigation-page-disclosure > .navigation-page-summary:hover > :first-child,
@@ -253,39 +458,43 @@
253
458
  text-underline-offset: 0.28em;
254
459
  }
255
460
 
256
- .navigation-page-disclosure:not(.navigation-category-disclosure)[open]
257
- > .navigation-page-summary > .navigation-page-summary-title {
258
- opacity: 0;
259
- }
260
-
261
461
  .navigation-category-disclosure[data-current-branch='true'] > .navigation-page-summary {
262
462
  color: var(--color-primary-text);
463
+ font-weight: 600;
263
464
  }
264
465
 
265
466
  .navigation-page-open-link {
266
- position: absolute;
267
- top: 0;
268
- left: 0;
269
- display: none;
270
- width: calc(100% - 2rem);
271
- padding: 0.45rem 0;
467
+ display: block;
468
+ min-width: 0;
469
+ width: 100%;
470
+ border-radius: var(--corner-radius-small, 2px);
471
+ padding: 0.375rem 0.3rem 0.375rem 0;
272
472
  color: var(--color-secondary-text);
273
- font-size: 0.86rem;
274
- line-height: 1.35;
473
+ font-size: 0.84rem;
474
+ font-weight: 400;
475
+ line-height: 1.4;
275
476
  overflow: visible;
276
477
  overflow-wrap: anywhere;
277
478
  text-decoration: none;
278
479
  white-space: normal;
279
480
  }
280
481
 
281
- .navigation-page-disclosure[open] > .navigation-page-open-link {
282
- display: block;
482
+ .navigation-page-node-page-disclosure > .navigation-page-open-link {
483
+ width: 100%;
283
484
  }
284
485
 
285
486
  .navigation-page-open-link:hover,
286
- .navigation-page-open-link:focus-visible,
487
+ .navigation-page-open-link:focus-visible {
488
+ background: color-mix(in srgb, var(--color-surface-soft-background) 68%, transparent);
489
+ color: var(--color-primary-text);
490
+ text-decoration: underline;
491
+ text-decoration-thickness: 1px;
492
+ text-underline-offset: 0.28em;
493
+ }
494
+
287
495
  .navigation-page-open-link[aria-current='page'] {
288
496
  color: var(--color-primary-text);
497
+ font-weight: 650;
289
498
  text-decoration: underline;
290
499
  text-decoration-thickness: 1px;
291
500
  text-underline-offset: 0.28em;
@@ -303,35 +512,59 @@
303
512
  transform: rotate(90deg);
304
513
  }
305
514
 
306
- .navigation-page-tree-sidebar > .navigation-page-node > .navigation-page-disclosure > .navigation-page-summary {
515
+ .navigation-page-tree-sidebar .navigation-page-chevron::before {
516
+ width: 0.38rem;
517
+ height: 0.38rem;
518
+ border-right: 1.5px solid currentColor;
519
+ border-bottom: 1.5px solid currentColor;
520
+ content: '';
521
+ transform: rotate(-45deg);
522
+ }
523
+
524
+ .navigation-page-tree-sidebar
525
+ .navigation-page-disclosure[open]
526
+ > .navigation-page-summary .navigation-page-chevron::before,
527
+ .navigation-page-tree-sidebar
528
+ .navigation-page-sections-disclosure[open]
529
+ > summary .navigation-page-chevron::before {
530
+ transform: rotate(45deg);
531
+ }
532
+
533
+ .tree-local-navigation
534
+ > nav
535
+ > .navigation-page-tree-sidebar
536
+ > .navigation-page-node
537
+ > .navigation-page-disclosure
538
+ > .navigation-page-summary {
307
539
  color: var(--color-primary-text);
308
- font-size: 0.94rem;
309
- font-weight: 700;
540
+ font-size: 0.9rem;
541
+ font-weight: 650;
310
542
  }
311
543
 
312
- .navigation-page-tree-sidebar > .navigation-page-node > .navigation-page-disclosure > .navigation-page-open-link {
544
+ .tree-local-navigation
545
+ > nav
546
+ > .navigation-page-tree-sidebar
547
+ > .navigation-page-node
548
+ > .navigation-page-open-link {
313
549
  color: var(--color-primary-text);
314
- font-size: 0.94rem;
315
- font-weight: 700;
550
+ font-size: 0.9rem;
551
+ font-weight: 650;
316
552
  }
317
553
 
318
- .navigation-page-tree-sidebar .navigation-page-disclosure > .navigation-page-branch-content {
319
- margin: 0.1rem 0 0.25rem 0.3rem;
320
- border-left: 1px solid color-mix(in srgb, currentColor 18%, transparent);
321
- padding-left: 0.85rem;
554
+ .navigation-page-tree-sidebar .navigation-page-disclosure > .navigation-page-branch-content,
555
+ .navigation-page-tree-sidebar .navigation-page-node-page-disclosure > .navigation-page-branch-content {
556
+ margin: 0.1rem 0 0.2rem 0.25rem;
557
+ border-left: 1px solid color-mix(in srgb, currentColor 16%, transparent);
558
+ padding-left: 0.75rem;
322
559
  }
323
560
 
324
- .navigation-page-tree-sidebar .navigation-page-disclosure .navigation-page-tree-sidebar {
325
- margin: 0.25rem 0;
561
+ .navigation-page-tree-sidebar .navigation-page-disclosure .navigation-page-tree-sidebar,
562
+ .navigation-page-tree-sidebar .navigation-page-branch-content > .navigation-page-tree-sidebar {
563
+ margin: 0.15rem 0;
326
564
  border-left: 0;
327
565
  padding-left: 0;
328
566
  }
329
567
 
330
- .navigation-page-disclosure[data-current-branch='true']:not([data-current-page='true']):not([data-sections-open='true'])
331
- > .navigation-page-branch-content > .navigation-page-sections {
332
- display: none;
333
- }
334
-
335
568
  .page-contents-links li + li {
336
569
  margin-top: 0.45rem;
337
570
  }
@@ -371,6 +604,24 @@
371
604
  content: '';
372
605
  }
373
606
 
607
+ .navigation-page-tree-sidebar .navigation-page-sections .page-contents-links a {
608
+ margin-inline: -0.4rem 0.2rem;
609
+ border-radius: var(--corner-radius-small, 2px);
610
+ padding-inline: 0.4rem;
611
+ }
612
+
613
+ .navigation-page-tree-sidebar
614
+ .navigation-page-sections .page-contents-links a[aria-current='location'] {
615
+ background: var(--tree-current-item-background);
616
+ color: var(--color-primary-text);
617
+ text-decoration-thickness: 1.5px;
618
+ }
619
+
620
+ .navigation-page-tree-sidebar
621
+ .navigation-page-sections .page-contents-links a[aria-current='location']::before {
622
+ content: none;
623
+ }
624
+
374
625
  .site-breadcrumbs {
375
626
  min-height: calc(clamp(1rem, 2.5vw, 1.5rem) + 1.35rem);
376
627
  width: min(100%, var(--reader-text-width, var(--page-text-width, var(--text-width))));
@@ -435,3 +686,101 @@
435
686
  .site-content-has-breadcrumbs > .site-section:first-of-type {
436
687
  padding-top: clamp(1.15rem, 2.5vw, 1.75rem);
437
688
  }
689
+
690
+ .site-content-has-page-sequence > .site-section:last-of-type,
691
+ .site-content-has-edit-source > .site-section:last-of-type {
692
+ padding-bottom: var(--space-content-block-gap);
693
+ }
694
+
695
+ .edit-source-link {
696
+ width: min(100%, var(--reader-text-width, var(--page-text-width, var(--text-width))));
697
+ margin: 0 var(--layout-inline-end-margin) var(--space-content-block-gap) var(--layout-inline-start-margin);
698
+ border-top: 1px solid var(--color-nav-separator);
699
+ padding-top: 0.75rem;
700
+ color: var(--color-secondary-text);
701
+ font-size: 0.84rem;
702
+ }
703
+
704
+ .edit-source-link a {
705
+ display: inline-flex;
706
+ align-items: center;
707
+ gap: 0.45rem;
708
+ color: inherit;
709
+ text-decoration: none;
710
+ }
711
+
712
+ .edit-source-link a:hover,
713
+ .edit-source-link a:focus-visible {
714
+ color: var(--color-primary-text);
715
+ text-decoration: underline;
716
+ text-underline-offset: 0.25em;
717
+ }
718
+
719
+ .edit-source-link svg {
720
+ width: 0.95rem;
721
+ height: 0.95rem;
722
+ stroke-width: 1.75;
723
+ }
724
+
725
+ .site-content-has-edit-source:not(.site-content-has-page-sequence) > .edit-source-link {
726
+ margin-bottom: var(--space-final-section-bottom);
727
+ }
728
+
729
+ .page-sequence-navigation {
730
+ display: grid;
731
+ grid-template-columns: repeat(2, minmax(0, 1fr));
732
+ gap: 0.75rem;
733
+ width: min(100%, var(--reader-text-width, var(--page-text-width, var(--text-width))));
734
+ margin-inline: var(--layout-inline-start-margin) var(--layout-inline-end-margin);
735
+ padding: 0 0 var(--space-final-section-bottom);
736
+ }
737
+
738
+ .page-sequence-link {
739
+ display: grid;
740
+ grid-template-columns: auto minmax(0, 1fr);
741
+ align-items: center;
742
+ gap: 0.65rem;
743
+ min-width: 0;
744
+ border: 1px solid var(--color-nav-separator);
745
+ border-radius: var(--corner-radius-medium);
746
+ padding: 0.8rem;
747
+ color: var(--color-primary-text);
748
+ text-decoration: none;
749
+ }
750
+
751
+ .page-sequence-link:hover,
752
+ .page-sequence-link:focus-visible {
753
+ border-color: var(--color-primary-text);
754
+ background: var(--color-surface-soft-background);
755
+ }
756
+
757
+ .page-sequence-link > svg {
758
+ width: 1rem;
759
+ height: 1rem;
760
+ stroke-width: 1.75;
761
+ }
762
+
763
+ .page-sequence-link > span {
764
+ display: grid;
765
+ min-width: 0;
766
+ gap: 0.15rem;
767
+ }
768
+
769
+ .page-sequence-next {
770
+ grid-template-columns: minmax(0, 1fr) auto;
771
+ text-align: right;
772
+ }
773
+
774
+ .page-sequence-direction {
775
+ color: var(--color-secondary-text);
776
+ font-size: 0.72rem;
777
+ font-weight: 650;
778
+ line-height: 1.3;
779
+ }
780
+
781
+ .page-sequence-title {
782
+ font-size: 0.92rem;
783
+ font-weight: 650;
784
+ line-height: 1.35;
785
+ overflow-wrap: anywhere;
786
+ }