diff --git a/resources/common/mixins.less b/resources/common/mixins.less index e45899273..c3eae1ebf 100644 --- a/resources/common/mixins.less +++ b/resources/common/mixins.less @@ -8,6 +8,8 @@ background: url( ../common/images/arrow-down.svg ) 100% 50% no-repeat; width: unit( 16 / @font-size-tabs / @font-size-browser, em ); height: unit( 16 / @font-size-tabs / @font-size-browser, em ); + // https://phabricator.wikimedia.org/T319070#8284272 + margin-left: -1px; } .mixin-vector-dropdown-menu-item() { diff --git a/resources/skins.vector.styles/components/MenuTabs.less b/resources/skins.vector.styles/components/MenuTabs.less index 0cad6b6dd..4c66db429 100644 --- a/resources/skins.vector.styles/components/MenuTabs.less +++ b/resources/skins.vector.styles/components/MenuTabs.less @@ -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; } } } diff --git a/resources/skins.vector.styles/components/StickyHeader.less b/resources/skins.vector.styles/components/StickyHeader.less index d8e521837..8817b2a76 100644 --- a/resources/skins.vector.styles/components/StickyHeader.less +++ b/resources/skins.vector.styles/components/StickyHeader.less @@ -42,6 +42,10 @@ &-context-bar { display: flex; align-items: center; + + .vector-feature-visual-enhancement-next-enabled & { + column-gap: 8px; + } } &-start { diff --git a/resources/skins.vector.styles/components/UserLinks.less b/resources/skins.vector.styles/components/UserLinks.less index 94c837913..43ee2fda0 100644 --- a/resources/skins.vector.styles/components/UserLinks.less +++ b/resources/skins.vector.styles/components/UserLinks.less @@ -66,12 +66,18 @@ /** * 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 { + .vector-feature-visual-enhancement-next-enabled & { + 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.