jonny
/
Vector-Local
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix padding/positioning of the user menu orange talk message notification 

The padding-top of the orange notification set in
ext.echo.styles.alert.less was being overriden by the `padding-top: 0`
set in UserLinks.less which was intended to only override the padding
set in Menu.less.

This commit:

* Scopes the li styles in Menu.less to apply only to the legacy user
menu (found in both legacy and modern vector with the consolidated user
links feature off) which appears to be the only menus that needs these
rules.

* The padding-top previously in UserLinks is no longer needed as a
result of the above point.

* Adjusts/cleans up the positioning of the orange notification by
removing an unneeded margin/padding-top and setting the top to 100% (the
previous `calc` statement was unintentionally resulting in 112%).

Bug: T287633
Change-Id: Ia7069d291f53d8e0e0e576d7b96b7a8b1a6cb29d
This commit is contained in:
Nicholas Ray 2021-07-28 13:42:30 -06:00
parent 7205a0b8e3
commit f62e1997f5
3 changed files with 13 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
resources/common/components/Menu.less
View File

@ -12,12 +12,16 @@
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;
}
}
// FIXME: Move these rules to the #p-personal li selector in
// skins.vector.styles.legacy/layouts/screen.less when modern Vector no longer
// uses the legacy user menu and only uses the new consolidated user links
// menu.
.vector-user-menu-legacy 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;
}

1
resources/skins.vector.styles/components/UserLinks.less
View File

@ -18,7 +18,6 @@
align-items: center;
li {
padding-top: 0;
margin: 0;
white-space: nowrap;

9
skinStyles/ext.echo.styles.alert.less
View File

@ -2,13 +2,8 @@
@import 'mediawiki.skin.variables.less';
.vector-user-links {
#pt-notifications-alert {
margin-right: 0.75em;
}
.vector-menu-content-list {
.mw-echo-alert {
margin: 0 0 0 0.2em;
padding: 0.2em 0.5em;
white-space: nowrap;
@ -21,10 +16,8 @@
.mw-echo-alert {
font-size: 12px;
position: absolute;
top: calc( 100% + 12px );
top: 100%;
right: 0;
margin-left: 0.75em;
padding-top: 0.25em;
}
}
}