From f52c2f8a4af1b03aac2a5de41b30dfd6544ff392 Mon Sep 17 00:00:00 2001
From: Jan Drewniak <jan.drewniak@gmail.com>
Date: Wed, 24 Mar 2021 15:01:04 +0100
Subject: [PATCH] Scope right-aligned dropdown menus to #right-navigation &
 .mw-portlet-lang

Removes the global rule for right-aligning the Vector dropdown menus
and instead scopes that alignment to dropdown menus that appear
inside #right-navigation and the language button in modern Vector.

Bug: T275158
Change-Id: I6c00ccc365f70682841d9eda9d31bbe25c757aa0
---
 resources/common/components/MenuDropdown.less              | 2 +-
 .../skins.vector.styles/components/LanguageButton.less     | 3 ++-
 resources/skins.vector.styles/layouts/screen.less          | 7 +++++++
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/resources/common/components/MenuDropdown.less b/resources/common/components/MenuDropdown.less
index a1afa2afb..3a47893e1 100644
--- a/resources/common/components/MenuDropdown.less
+++ b/resources/common/components/MenuDropdown.less
@@ -53,7 +53,7 @@
 		min-width: 100%;
 		position: absolute;
 		top: 2.5em;
-		right: -@border-width-base;
+		left: -@border-width-base;
 		margin: 0;
 		border: @border-width-base @border-style-base @border-color-base;
 		border-top-width: 0;
diff --git a/resources/skins.vector.styles/components/LanguageButton.less b/resources/skins.vector.styles/components/LanguageButton.less
index 1c15ad5bd..fc3d014c1 100644
--- a/resources/skins.vector.styles/components/LanguageButton.less
+++ b/resources/skins.vector.styles/components/LanguageButton.less
@@ -30,7 +30,8 @@
 
 	.vector-menu-content {
 		top: auto;
-		right: 0;
+		left: auto;
+		right: -@border-width-base;
 		// align borders of open menu align with button
 		.box-sizing( border-box );
 		max-height: 65vh;
diff --git a/resources/skins.vector.styles/layouts/screen.less b/resources/skins.vector.styles/layouts/screen.less
index 315456b48..498dc0551 100644
--- a/resources/skins.vector.styles/layouts/screen.less
+++ b/resources/skins.vector.styles/layouts/screen.less
@@ -239,6 +239,13 @@ body {
 
 #right-navigation {
 	float: right;
+
+	// Any dropdowns inside the right navigation in modern Vector (e.g. "more" menu).
+	// should be right-aligned to prevent horizontal scrolling.
+	.vector-menu-content {
+		left: auto;
+		right: -@border-width-base;
+	}
 }
 
 #p-personal {