fix: straighten mobile page outline

This commit is contained in:
dadachann
2026-09-04 14:17:46 +00:00
parent 9b829b5b7d
commit 0ae55aecbc
2 changed files with 9 additions and 3 deletions
+7 -3
View File
@@ -14,18 +14,22 @@ body {
/* Keep the page outline visually quiet: one rail, no stepped connectors. */
#nd-toc > div > div {
#nd-toc > div > div,
[data-toc-popover-content] div.relative.flex.flex-col:has(> a[href^="#"]) {
border-inline-start: 1px solid color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
margin-inline-start: 0.53125rem;
}
#nd-toc > div > div > a > svg,
#nd-toc > div > div > div.absolute {
#nd-toc > div > div > div.absolute,
[data-toc-popover-content] a[href^="#"] > svg,
[data-toc-popover-content] div.relative.flex.flex-col:has(> a[href^="#"]) > div.absolute {
display: none;
}
/* Keep every active segment on one x-axis, even when labels are indented. */
#nd-toc > div > div > a[data-active="true"]::before {
#nd-toc > div > div > a[data-active="true"]::before,
[data-toc-popover-content] a[href^="#"][data-active="true"]::before {
content: "";
position: absolute;
inset-block: -0.375rem;
+2
View File
@@ -14,7 +14,9 @@ test("the documentation keeps a neutral base with custom section and TOC treatme
assert.match(css, /#nd-toc > div > div/);
assert.match(css, /#nd-toc > div > div > a > svg/);
assert.match(css, /#nd-toc > div > div > div\.absolute/);
assert.match(css, /\[data-toc-popover-content\].*> div\.absolute/s);
assert.match(css, /a\[data-active="true"\]::before/);
assert.match(css, /\[data-toc-popover-content\] a\[href\^="#"\]\[data-active="true"\]::before/);
assert.match(css, /inset-inline-start: 0\.5rem/);
assert.match(css, /border-radius: 0/);
});