MediaWiki:Common.css: Difference between revisions

Content deleted Content added
No edit summary
No edit summary
Line 1,708:
.vector-toc .vector-toc-link:hover { color: var(--ed-ink) !important; }
.vector-toc .vector-toc-list-item-active > .vector-toc-link { color: var(--ed-ink) !important; }
 
/* ── TOC geometry: ONE text axis + nested rails + right-edge chevron.
Vector indents every list item to reserve a LEFT gutter for the
toggle chevron, which breaks the contents column's left line.
Instead: list items sit flush (level-1 text on the CONTENTS/title
axis), the chevron moves to the RIGHT edge of the row, and each
nested list carries a hairline rail sitting exactly ON its
parent's text axis (the nested ul's left edge IS the parent text x
once the li padding is zeroed) — the same geometry as the prose
list markers, stepped by the same --ed-list-indent token. The
rail of the subtree being read tints to ink (active trail). ── */
.vector-toc .vector-toc-contents,
.vector-toc .vector-toc-list {
margin: 0;
padding: 0;
list-style: none;
}
.vector-toc .vector-toc-list-item {
position: relative;
padding-left: 0 !important; /* kill Vector's left chevron gutter */
padding-right: 1.6rem; /* uniform room for the right-edge chevron */
}
.vector-toc .vector-toc-list-item > .vector-toc-list {
border-left: 1px solid var(--ed-hairline);
padding-left: calc(var(--ed-list-indent) - 1px);
margin-top: 0.1rem;
}
.vector-toc .vector-toc-list:has(.vector-toc-list-item-active) {
border-left-color: var(--ed-ink); /* active trail */
}
/* chevron: quiet, small, far right; positioning ONLY — Vector owns the
expand/collapse transform, so no transforms here */
.vector-toc .vector-toc-toggle {
position: absolute !important;
left: auto !important;
right: 0 !important;
top: -0.2rem; /* CALIBRATION: centers on the first line */
margin: 0 !important;
padding: 0 !important;
min-width: 0 !important;
min-height: 0 !important;
width: 1.5rem;
height: 1.5rem;
opacity: 0.55; /* --ed-faint weight without touching the icon */
}
.vector-toc .vector-toc-toggle:hover { opacity: 1; }
 
/* ── Infobox: the page's ONE white card, in the data voice; its width