mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-12-19 03:10:47 +00:00
115 lines
2.4 KiB
Plaintext
115 lines
2.4 KiB
Plaintext
/**
|
|
* UserLinks
|
|
* All links and menus that appear in the header,
|
|
* at the top of the page, after the search bar.
|
|
*/
|
|
|
|
/**
|
|
* Top-most container that holds ALL menus in the user links section
|
|
* (horizontal menus and dropdowns)
|
|
* Logged-in and logged-out.
|
|
*/
|
|
.vector-user-links {
|
|
display: flex;
|
|
align-items: center;
|
|
position: relative;
|
|
justify-content: flex-end;
|
|
flex-shrink: 1;
|
|
|
|
// Spacing for all top-level menu icons.
|
|
.mw-list-item,
|
|
.vector-dropdown-label {
|
|
margin: 0 @spacing-25;
|
|
}
|
|
// Reset margins on items inside dropdowns.
|
|
.vector-dropdown-content .mw-list-item {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Container that holds just the dropdown user menu (displays "..." when logged out).
|
|
* Logged-in and logged-out.
|
|
*/
|
|
.vector-user-menu {
|
|
.vector-dropdown-content {
|
|
.mixin-vector-dropdown-content-flip();
|
|
}
|
|
|
|
// Used to hide collapsible items inside the dropdown menu
|
|
// as well as the dropdown menu itself when the menu is empty
|
|
&.user-links-collapsible-item,
|
|
.user-links-collapsible-item {
|
|
@media ( min-width: @min-width-breakpoint-tablet ) {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Container that holds all menus except the user menu (.vector-user-menu).
|
|
* Logged-in and logged-out.
|
|
*/
|
|
.vector-user-links-main {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.vector-menu-content-list {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: @font-size-small;
|
|
}
|
|
|
|
.user-links-collapsible-item {
|
|
@media ( max-width: @max-width-breakpoint-mobile ) {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Logged-in dropdown user menu.
|
|
*/
|
|
.vector-user-menu-logged-in .vector-dropdown-label {
|
|
.mixin-vector-arrowed-dropdown-toggle();
|
|
}
|
|
|
|
/**
|
|
* Logged-out dropdown user menu items- Special treatment for special links.
|
|
*/
|
|
#p-user-menu-anon-editor .vector-menu-heading {
|
|
display: block;
|
|
|
|
a::before {
|
|
content: '@{msg-parentheses-start}';
|
|
}
|
|
|
|
a::after {
|
|
content: '@{msg-parentheses-end}';
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Logged-in user-page link in personal (overflow) menu.
|
|
*/
|
|
#pt-userpage-2 {
|
|
max-width: unit( 155 / @font-size-browser / @font-size-small, em );
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
|
|
a:not( .mw-selflink ) {
|
|
// T312157 Override redlink (.new) color for non-existant userpage
|
|
color: @color-progressive;
|
|
}
|
|
|
|
span {
|
|
.text-overflow( @visible: false );
|
|
}
|
|
|
|
// T287522#7295558: Increase the max-width of the username when viewport
|
|
// allows for it.
|
|
@media ( min-width: @min-width-breakpoint-desktop-wide ) {
|
|
max-width: unit( 200 / @font-size-browser / @font-size-small, em );
|
|
}
|
|
}
|