diff --git a/includes/templates/TableOfContentsContainer.mustache b/includes/templates/TableOfContentsContainer.mustache index 39646f17a..e3e172f2a 100644 --- a/includes/templates/TableOfContentsContainer.mustache +++ b/includes/templates/TableOfContentsContainer.mustache @@ -1,4 +1,4 @@ -
+
{{! T313060 Additional container div needed to prevent the sticky element from being siblings with the footer }} {{#data-toc}}
diff --git a/resources/skins.vector.styles/components/MainMenu.less b/resources/skins.vector.styles/components/MainMenu.less index 0b614d037..ea94d94bc 100644 --- a/resources/skins.vector.styles/components/MainMenu.less +++ b/resources/skins.vector.styles/components/MainMenu.less @@ -16,17 +16,15 @@ // Align the left edge of main menu with the main menu button. width: @width-sidebar-px; - .vector-feature-visual-enhancement-next-disabled & { - .mixin-vector-flush-left-margin-left(); + //FIXME: This media query will be replaced with the pinned menu class in T317897 + @media ( min-width: @min-width-desktop ) { + // Magic number from the edge of the main menu to the start of the main menu text. + margin-left: -28px; } // Align the left edge of main menu with the main menu button icon. @media ( min-width: @min-width-desktop-wide ) { width: @width-sidebar-px-wide; - - .vector-feature-visual-enhancement-next-disabled & { - margin-left: 0; - } } } diff --git a/resources/skins.vector.styles/components/TableOfContents.less b/resources/skins.vector.styles/components/TableOfContents.less index c554e3ca3..dc08bab24 100644 --- a/resources/skins.vector.styles/components/TableOfContents.less +++ b/resources/skins.vector.styles/components/TableOfContents.less @@ -6,7 +6,7 @@ // Sidebar TOC uses increased left padding and a negative left margin to achieve // a 15px spacing without clipping the chevron icon // https://phabricator.wikimedia.org/T312156#8095894 -@sidebar-toc-left-padding: 15px + @icon-padding-md; +@sidebar-toc-left-padding: 15px + @sidebar-toc-right-padding; @toc-subsection-toggle-icon-size: 1.834em; .mw-table-of-contents-container { @@ -24,10 +24,6 @@ position: sticky; top: 0; - .vector-feature-visual-enhancement-next-disabled & { - margin-left: 0; - } - @media ( min-width: @min-width-desktop ) { .vector-toc-not-collapsed & { // Default spacing separating the sidebar TOC from the main menu or viewport. @@ -42,18 +38,11 @@ } } -.vector-feature-visual-enhancement-next-disabled { - .sidebar-toc, - .sidebar-toc:after { - // T312156 Update TOC spacing after removing background color - // Align the left edge of the TOC text with the main menu button icon. - margin-left: -@sidebar-toc-left-padding; - - @media ( min-width: @min-width-desktop-wide ) { - // Align the TOC subsection toggle button icon with the main menu button icon. - margin-left: -@icon-padding-md; - } - } +.sidebar-toc, +.sidebar-toc:after { + // T312156 Update TOC spacing after removing background color + // Align the left edge of the TOC text with the main menu button icon. + margin-left: -@sidebar-toc-left-padding; } .sidebar-toc { diff --git a/resources/skins.vector.styles/components/TableOfContentsCollapsed.less b/resources/skins.vector.styles/components/TableOfContentsCollapsed.less index e3911159e..34b884a05 100644 --- a/resources/skins.vector.styles/components/TableOfContentsCollapsed.less +++ b/resources/skins.vector.styles/components/TableOfContentsCollapsed.less @@ -161,11 +161,9 @@ } // Disable left and right margin - &.vector-feature-visual-enhancement-next-disabled { - .sidebar-toc { - margin-left: 0; - margin-right: 0; - } + .sidebar-toc { + margin-left: 0; + margin-right: 0; } }