Revision as of 20:38, 3 July 2026 view source Wikilah admin (talk \| contribs) Bots, Bureaucrats, Editors, emailconfirmed, Interface administrators, Administrators (Semantic MediaWiki), Curators (Semantic MediaWiki), Editors (Semantic MediaWiki), Suppressors, Administrators, Widget editors 9,529 edits No edit summary ← Older edit		Revision as of 21:04, 3 July 2026 view source Wikilah admin (talk \| contribs) Bots, Bureaucrats, Editors, emailconfirmed, Interface administrators, Administrators (Semantic MediaWiki), Curators (Semantic MediaWiki), Editors (Semantic MediaWiki), Suppressors, Administrators, Widget editors 9,529 edits No edit summary Newer edit →
Line 1,313: /* Scrollbars everywhere match the wikitable scroll wrapper — thin, warm thumb (--wt-th-bg) on a transparent track. scrollbar-width/color are INHERITED ~~properties~~, so ~~declaring~~:root/body ~~them at~~sets the ~~root~~baseline ~~cascades~~AND styles the towindow ~~EVERY~~bar. ~~scroll~~BUT ~~container~~Vector styles (the sticky TOC ~~sidebar,~~scroll ~~the~~container ~~window~~DIRECTLY ~~bar,~~with ~~panels)~~its ~~without~~own (wider) scrollbar-width, and a direct rule beats an inherited value — ~~naming each element — which is why the earlier element-targeted rule~~ ~~missed~~which is why the TOC. ~~Declared~~bar onstayed ~~:root~~THICKER ~~AND~~than ~~body~~the sotable's aeven ~~skin~~after ~~rule on <body>~~the color matched (Vector sets width there but not color, so color inherited ~~cannot shadow the inherited value. The wikitable wrapper re-declares~~ through while width did not). The universal !important rule below FORCES ~~the same two values (section 12, below) purely for self-documentation. /~~ the same thin width + warm color onto every element: !important outranks any normal skin rule regardless of its selector specificity, so no scroll container — named or not — can override it. / :root, body { scrollbar-width: thin; scrollbar-color: var(--wt-th-bg) transparent; } * { ~~/* belt-and-suspenders: name the Vector 2022 TOC scroll containers directly,~~ ~~with the id form + !important, so that even if a skin rule pins~~ ~~scrollbar-color on the container (blocking the inherited value) ours wins.~~ ~~If the real scroller is none of these, the inherited :root/body rule above~~ ~~still reaches it (it is always a descendant of <body>). /~~ ~~#vector-toc-pinned-container,~~ ~~#vector-toc,~~ ~~.vector-pinned-container,~~ ~~.vector-toc,~~ ~~.vector-column-start {~~ scrollbar-width: thin !important; scrollbar-color: var(--wt-th-bg) transparent !important; } / WebKit/Blink path. The standard properties above are IGNORED by Chrome for any element a skin targets with ::-webkit-scrollbar (webkit pseudo-elements take precedence) — that is why `* !important` above did NOT thin the TOC bar: Vector styles the sticky TOC scroller with ::-webkit-scrollbar. So restyle the webkit scrollbar globally to a matching thin warm bar; !important beats any non-important skin ::-webkit-scrollbar rule regardless of its selector specificity. Defining ANY ::-webkit-scrollbar rule switches every scrollbar (table + window included) to this custom bar, so they all render identically: 8px, warm thumb (--wt-th-bg), transparent track. / ::-webkit-scrollbar { width: 8px !important; height: 8px !important; } ::-webkit-scrollbar-track { background: transparent !important; } ::-webkit-scrollbar-thumb { background: var(--wt-th-bg) !important; border-radius: 4px !important; } ::-webkit-scrollbar-thumb:hover { background: var(--wt-rule) !important; } ::-webkit-scrollbar-corner { background: transparent !important; } / Minerva (mobile skin) paints its own white wrappers over body */ #mw-mf-page-center, .mw-body { background-color: var(--ed-paper) !important; }

MediaWiki:Common.css: Difference between revisions