mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-12-18 16:51:05 +00:00
433458ba98
On desktop, the "Alert" icon had more white space around it than the "Notice" icon, and its popup displayed with a different offset. On mobile, the combined icon jumped around while the page was loading. Change-Id: Icdd5bc6e8478f3453b6461a35b7fb53e8ab014e9
47 lines
1.3 KiB
Plaintext
47 lines
1.3 KiB
Plaintext
@import '../../minerva.less/minerva.variables.less';
|
|
// stylelint-disable selector-max-id
|
|
|
|
// The top level user account button in the upper right near the notifications button.
|
|
.minerva-user-navigation {
|
|
display: flex;
|
|
// Keep space for at least two buttons.
|
|
min-width: 2 * @menuButtonIconSize;
|
|
// Support Firefox: Needs `min-height` to vertically align icons in menu. See T233517.
|
|
min-height: @siteHeaderHeight;
|
|
height: 100%;
|
|
// FIXME: for cached HTML. Merge with `.minerva-search-form + .minerva-user-navigation`.
|
|
width: 100%;
|
|
// Center vertically.
|
|
align-items: center;
|
|
// Layout from right / end.
|
|
justify-content: flex-end;
|
|
// Show the list relative the button.
|
|
position: relative;
|
|
|
|
// align the last icon (i.e. notification or use menu) with the container edge.
|
|
& > *:last-child {
|
|
margin-right: -@icon-padding-md;
|
|
}
|
|
|
|
// desktop mode modifications
|
|
.minerva-user-notifications {
|
|
ul {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
li#pt-notifications-notice,
|
|
li#pt-notifications-alert {
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Different rule for cached HTML
|
|
// Can be merged into `.minerva-user-navigation` rule one week after this
|
|
// change was introduced and minerva-search-form class is present everywhere.
|
|
.minerva-search-form + .minerva-user-navigation {
|
|
min-width: auto;
|
|
width: auto;
|
|
}
|