Merge "Align language button"

This commit is contained in:
jenkins-bot 2022-09-07 22:21:27 +00:00 committed by Gerrit Code Review
commit e60716e63d
4 changed files with 17 additions and 13 deletions

View File

@ -64,8 +64,8 @@
@size-icon: unit( 20 / @font-size-browser, em );
@size-indicator: unit( 12 / @font-size-browser, em );
// Copied from mediawiki.ui.icons
@icon-padding-md: unit( 12 / @font-size-browser, em );
// Copied from mediawiki.ui.icons, but converted to px to match `mw-ui-button`
@icon-padding-md: 12px;
@background-position-nav-personal-icon: left unit( 4 / @font-size-browser / @font-size-nav-personal, em );
@background-size-nav-personal-icon: unit( 14 / @font-size-browser / @font-size-nav-personal, em );
@ -138,9 +138,6 @@
// Sidebar
@width-sidebar-px: 220px;
@width-sidebar-px-wide: 244px;
// T305069 Layout adjustments of sidebar elements:
// Vertically align the left edge of sidebar elements with the visible edge of the sidebar toggle hamburger menu.
@margin-start-sidebar-content: unit( 12px / @font-size-browser, em ); // 0.75em @ 16
// TOC
@sidebar-toc-selector: ~'.mw-table-of-contents-container .sidebar-toc';

View File

@ -9,6 +9,7 @@
.mw-body-header .mw-portlet-lang {
// FIXME [review whether margin-top is needed] center vertically in heading.
margin-top: 2px;
margin-right: -@icon-padding-md;
box-sizing: border-box;
height: @height-button-lang;

View File

@ -3,26 +3,32 @@
@import '../layouts/screen.less';
@import './checkboxHack.less';
// Match styles between TOC and fade element to ensure the fade covers the correct area
// This is expressed in pixels to support different font sizes since our layout is currently
// expressed in pixels. See T313817.
.sidebar-toc:after,
.mw-sidebar,
.sidebar-toc,
.sidebar-toc:after {
// Match styles between TOC and fade element to ensure the fade covers the correct area
// This is expressed in pixels to support different font sizes since our layout is currently
// expressed in pixels. See T313817.
.sidebar-toc {
// T305069 Layout adjustments of sidebar elements
// Align the left edge of main menu with the main menu button.
width: @width-sidebar-px;
margin-left: 0;
// 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;
margin-left: @margin-start-sidebar-content;
margin-left: @icon-padding-md;
}
}
.sidebar-toc,
.sidebar-toc:after {
margin-left: -@margin-start-sidebar-content;
// T312156 Update TOC spacing after removing background color
// Align the left edge of the TOC text with the main menu button icon.
margin-left: -@icon-padding-md;
@media ( min-width: @min-width-desktop-wide ) {
// Align the TOC subsection toggle button icon with the main menu button icon.
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: ~'calc( 15px + @{margin-start-sidebar-content} )';
@sidebar-toc-left-padding: 15px + @icon-padding-md;
@toc-subsection-toggle-icon-size: 1.834em;
.mw-table-of-contents-container {