wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-09-25 11:17:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Add default width and max width to dropdowns in modern Vector, preserve existing styles for legacy Vector"

Browse source
This commit is contained in:
jenkins-bot 2023-01-12 20:37:31 +00:00 committed by Gerrit Code Review
parent 4aba97cce3 d309544c80
commit 270e2cbfe4
7 changed files with 35 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
resources/common/components/MenuDropdownCheckbox.less
View file

@ -20,8 +20,6 @@
height: 0;
visibility: hidden;
overflow: hidden;
// The menu content should not be narrower than the menu button.
min-width: 100%;
margin: 0;
padding: 0;
z-index: @z-index-menu;
@ -38,9 +36,6 @@
margin: 0;
a {
// displays all links in a single column.
display: block;
white-space: nowrap;
cursor: pointer;
}
}

5
resources/skins.vector.styles.legacy/components/MenuDropdown.less
View file

@ -56,6 +56,8 @@
box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
transition-property: opacity;
transition-duration: @transition-duration-base;
// The menu content should not be narrower than the menu button.
min-width: 100%;
}
// Open the dropdown container via hover.
@ -74,6 +76,9 @@
}
a {
// displays all links in a single column.
display: block;
white-space: nowrap;
padding: 0.625em;
color: @color-link;
}

12
resources/skins.vector.styles/components/Dropdown.less
View file

@ -26,6 +26,17 @@
box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
transition-property: opacity;
transition-duration: @transition-duration-base;
.vector-feature-page-tools-disabled & {
// The menu content should not be narrower than the menu button.
min-width: 100%;
}
.vector-feature-page-tools-enabled & {
// TODO Add consistent min/max values for dropdowns in T316055
width: max-content;
max-width: 200px;
}
}
}
@ -35,7 +46,6 @@
.vector-dropdown .mw-list-item {
a {
.mixin-vector-dropdown-menu-item();
white-space: nowrap;
color: @color-link;
.vector-feature-page-tools-disabled & {

3
resources/skins.vector.styles/components/MainMenu.less
View file

@ -60,9 +60,6 @@
// Main menu when unpinned in the dropdown
#vector-main-menu-unpinned-container .vector-main-menu {
// TODO: Standardize dropdown min and max width
width: 250px;
.vector-language-sidebar-alert {
margin-bottom: 6px;
}

7
resources/skins.vector.styles/components/MenuTabs.less
View file

@ -52,10 +52,15 @@
margin: 0 @padding-horizontal-tabs;
}
.vector-menu-tabs .mw-list-item,
.vector-page-toolbar-container .vector-menu-dropdown > .vector-menu-heading {
// Only apply no wrap
white-space: nowrap;
}
.vector-menu-tabs .mw-list-item,
.vector-page-toolbar-container .vector-menu-dropdown {
float: left;
white-space: nowrap;
margin-bottom: 0; /* overrides default `li` styling */
// target links inside of .vector-tab-menu

9
resources/skins.vector.styles/components/TableOfContentsUnpinned.less
View file

@ -27,6 +27,11 @@
.mixin-toc-unpinned() {
display: block;
> .vector-menu-content {
// Override default dropdown max width
max-width: none;
}
// Shared unpinned TOC styles, applies across all unpinned cases (page titlebar, sticky header, floating)
// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
.sidebar-toc,
@ -142,6 +147,10 @@
z-index: @z-index-menu;
}
.vector-feature-page-tools-enabled .vector-toc {
padding-left: @padding-horizontal-dropdown-menu-item;
}
// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .sidebar-toc,
@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .vector-toc {

7
resources/skins.vector.styles/components/UserLinks.less
View file

@ -39,8 +39,10 @@
.vector-menu-content {
left: auto;
right: 0;
// TODO: Standardize dropdown min and max width
min-width: 200px;
.vector-feature-page-tools-disabled & {
min-width: 200px;
}
}
.user-links-collapsible-item {
@ -60,7 +62,6 @@
.vector-feature-page-tools-disabled & {
.mixin-vector-dropdown-menu-item-deprecated();
}
white-space: nowrap;
color: @color-link;
}
}