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

Visual enhancements next: Fix alignments of icons 

* Add 8px margins between mw-list-item in header
* Fixes vertical alignment on watchstar
* Fixes alignment of Echo icons

There should be no visual regressions (on master with defaults)
with this change.

Bug: T319070
Change-Id: I410c051da2129d6de10bc762e1b484cf30b6dab3
This commit is contained in:
Jon Robson 2022-09-22 12:31:11 -07:00 committed by Jdlrobson
parent 98068d9598
commit 2a2496f818
3 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
resources/skins.vector.styles/components/MenuTabs.less
View File

@ -93,9 +93,9 @@
.mw-list-item {
.mw-ui-icon {
// Align small icons with the bottom of the tabs.
// Height of tab is 41px, and small icon is 36px,
// With 1px border, 41 - 36 + 1;
margin: 4px 0 0 0;
// Height of tab is 38px, and small icon is 32px,
// With 2px border, 38 - 32 + 2
margin: 8px 0 0 0;
}
}
}

4
resources/skins.vector.styles/components/StickyHeader.less
View File

@ -42,6 +42,10 @@
&-context-bar {
display: flex;
align-items: center;
.vector-feature-visual-enhancement-next-enabled & {
column-gap: 8px;
}
}
&-start {

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

@ -66,12 +66,16 @@
/**
* Horizontal links menu - logged in and logged out.
*/
// TODO: Remove vector-user-menu-more after I371bb11903d8cdd8f0da89266fcf549050c0da8c has been in prod for a week
.vector-user-menu-more,
.vector-user-menu-overflow {
margin-right: 8px;
.vector-menu-content-list {
display: flex;
align-items: center;
.vector-feature-visual-enhancement-next-enabled & {
column-gap: 8px;
}
}
// Add margin to links that don't have the .mw-ui-button or related icon classes.