MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 427: / Line 427: @@
 }
-/* TOC list item — flex so link and toggle sit on same line.
+/* TOC list item — let Vector's default block layout handle rows.
-    flex-wrap: nowrap prevents rows from stacking/overlapping. */
+   We only need the toggle to sit inline with the link, which Vector
-.vector-toc .vector-toc-list-item {
+    already does via its own flex. We avoid overriding display/flex-wrap
-  display: flex !important;
+   here because that was collapsing link text to single characters. */
-  align-items: center !important;
-  flex-wrap: nowrap !important;
-  min-height: 0 !important;
-}
-.vector-toc .vector-toc-list-item > .vector-toc-link {
+/* Toggle button — fixed px size, immune to parent font-size: 1.1em */
-  flex: 1 1 auto !important;
-  min-width: 0 !important;
-}
-/* Sublist takes full width on its own line */
-.vector-toc .vector-toc-list-item > .vector-toc-list {
-  flex: none !important;
-  width: 100% !important;
-  display: block !important;
-}
-/* Toggle button — fixed px dimensions so it's immune to the parent's
-   large font-size (1.1em) and line-height (2). align-self: center
-   ensures it vertically centres in the flex row regardless of how
-   tall the link text is. */
 .vector-toc .cdx-button.vector-toc-toggle {
-  flex: 0 0 auto !important;
    background: none !important;
    border: none !important;
@@ Line 464: / Line 444: @@
    width: 24px !important;
    height: 24px !important;
-  align-self: center !important;
    cursor: pointer !important;
    opacity: 0.5;
@@ Line 470: / Line 449: @@
    align-items: center !important;
    justify-content: center !important;
+  vertical-align: middle !important;
 }
@@ Line 506: / Line 486: @@
 }
-/* min-height (not fixed height) so the link can grow with its content.
+/* Let Vector control .vector-toc-link height/display — we don't override it. */
-   The toggle no longer inherits this as a constraint. */
-.vector-toc-link {
-  min-height: 2rem;
-  display: flex;
-  align-items: center;
-}
 .gr-doc-teekas { margin-bottom: 1em; }