MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 298: / Line 298: @@
 /* ── Vector 2022 sidebar TOC ──────────────────────────────────── */
+/* Only override colours, sizes, and chevron styling.
+ * Never override display/flex/layout — Vector 2022 manages its own
+ * TOC layout and overriding it breaks multi-script rendering. */
 .vector-toc {
-   font-size: 0.98em !important;
+   font-size: 0.95em !important;
-   line-height: 1.65 !important;
+   line-height: 1.6 !important;
 }
-/* TOC text uses the same serif as the document body */
+/* "Contents" heading */
-.vector-toc .vector-toc-link,
-.vector-toc .vector-toc-text,
-.vector-toc .vector-toc-numb {
-  font-family: 'Adishila', 'Noto Serif Devanagari', serif !important;
-}
-/* "Contents" heading — subtle, matches site's muted label style */
 .vector-toc .vector-toc-title {
    font-size: 0.72em !important;
@@ Line 318: / Line 314: @@
    color: #b07040 !important;
    font-family: system-ui, sans-serif !important;
-   margin-bottom: 4px !important;
+   margin-bottom: 2px !important;
 }
-/* Section expand/collapse chevron — align it properly with the link text.
+/* Chevron toggle button — colour and size only, no layout override */
- * Vector renders it as a <button class="cdx-button vector-toc-toggle"> that
- * sits BEFORE the <a> inside .vector-toc-list-item.  We reset all the Codex
- * button chrome and size it to match the line-height of the TOC text. */
 .vector-toc .cdx-button.vector-toc-toggle {
-  /* Reset Codex chrome completely */
    background: none !important;
    border: none !important;
    box-shadow: none !important;
-  outline: none !important;
-  /* Size & spacing */
-  padding: 0 2px 0 0 !important;
-  margin: 0 !important;
-  min-width: 0 !important;
-  min-height: 0 !important;
-  width: 18px !important;
-  height: 1em !important;
-  /* Vertical alignment — sit inline with the link text */
-  display: inline-flex !important;
-  align-items: center !important;
-  justify-content: center !important;
-  vertical-align: middle !important;
-  flex-shrink: 0 !important;
-  cursor: pointer !important;
-  /* Colour — use the same brown as inactive TOC links */
    color: #9a6030 !important;
    opacity: 1 !important;
-   transition: color 0.15s, transform 0.15s !important;
+   transition: color 0.15s !important;
 }
 .vector-toc .cdx-button.vector-toc-toggle:hover {
    color: #f57c00 !important;
+  background: none !important;
 }
-/* Rotate the chevron SVG when the section is collapsed */
-.vector-toc-list-item-collapsed .cdx-button.vector-toc-toggle {
-  transform: rotate(-90deg) !important;
-}
-/* The SVG icon inside the button */
 .vector-toc .cdx-button.vector-toc-toggle svg {
-  width: 12px !important;
-  height: 12px !important;
    fill: currentColor !important;
-  pointer-events: none;
 }
-/* TOC list item layout — button + link sit side by side */
+/* Hide section numbers in TOC — consistent across all scripts */
-.vector-toc .vector-toc-list-item {
+.vector-toc .vector-toc-numb {
-   display: flex !important;
+   display: none !important;
-  align-items: center !important;
-  gap: 0 !important;
 }
-.vector-toc .vector-toc-link {
-   flex: 1 !important;
+/* Allow long section names (Kannada, Tamil, etc.) to wrap rather than
-   display: flex !important;
+ * overflow or overlap. Vector sets nowrap by default which causes
-   align-items: center !important;
+ * multi-script long titles to bleed out of the sidebar column. */
-   gap: 4px !important;
+.vector-toc .vector-toc-text {
-   padding: 1px 0 !important;
+   white-space: normal !important;
+   word-break: break-word !important;
+   overflow-wrap: anywhere !important;
+   line-height: 1.35 !important;
+   display: inline !important;
 }
-/* Number prefix — small, muted */
-.vector-toc .vector-toc-numb {
-  font-size: 0.8em !important;
-  color: #c8945a !important;
-  margin-right: 3px !important;
-  flex-shrink: 0 !important;
-}
 .vector-toc a,