mediawiki-skins-Vector/resources/skins.vector.styles/Menu.less
Jan Drewniak 4ff30a16a0 Convert personal menu to use flexbox alignment.
Uses flexbox alignment to resolve an issue where the
clickable area of the notification and alert icons were
overlapping with the links next to them.

Bug: T264339
Change-Id: I2afc12504d7184583fa8331479125474c68017dc
2020-10-29 15:53:56 +01:00

59 lines
1.3 KiB
Plaintext

@import '../../variables.less';
@import 'mediawiki.mixins.less';
/* Personal Menu */
#p-personal .vector-menu-content-list {
display: flex;
flex-wrap: wrap;
flex-grow: 1;
justify-content: flex-end;
align-items: baseline;
}
/* Personal Menu */
.mw-portlet {
// Hidden by default, but displayed by certain menus
// e.g. MenuPortal
h3 {
display: none;
}
ul {
list-style: none none;
margin: 0;
}
li {
margin-left: 0.75em;
// `padding-top` instead of `margin-top` necessary for
// anonymous user icon position below
padding-top: 0.5em;
line-height: @line-height-nav-personal;
}
}
/* Icon for registered user names & anonymous message */
#pt-anonuserpage,
#pt-userpage a {
background-image: url( images/user-avatar.svg );
background-position: @background-position-nav-personal-icon;
background-repeat: no-repeat;
background-size: @background-size-nav-personal-icon @background-size-nav-personal-icon;
// Same as `#p-personal li` above
padding-top: 0.5em !important; // stylelint-disable-line declaration-no-important
padding-left: 16px !important; // stylelint-disable-line declaration-no-important
}
#pt-userpage {
padding-top: 0 !important; // stylelint-disable-line declaration-no-important
a {
display: inline-block;
}
}
/* Show anonymous "Not logged in" text in gray */
#pt-anonuserpage {
color: #54595d;
}