Merge "Align text of main menu and ToC to main menu button"

This commit is contained in:
jenkins-bot 2022-11-01 16:47:05 +00:00 committed by Gerrit Code Review
commit e857cfa9e1
4 changed files with 14 additions and 29 deletions

View file

@ -1,4 +1,4 @@
<div class="mw-table-of-contents-container mw-ui-icon-flush-left">
<div class="mw-table-of-contents-container">
{{! T313060 Additional container div needed to prevent the sticky element from being siblings with the footer }}
{{#data-toc}}
<div class="vector-sticky-toc-container">

View file

@ -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;
}
}
}

View file

@ -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 {

View file

@ -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;
}
}