From b5aa05590005fe4ca522c79729409f1ea84edd4f Mon Sep 17 00:00:00 2001
From: bwang <bwang@wikimedia.org>
Date: Wed, 2 Jun 2021 14:48:25 -0500
Subject: [PATCH] Update UserLinks styles to use classes instead of ids

Follow up to: 298f945983

Change-Id: I5bc28501d0ae4c2597796dbf1ed9c10eacadad62
---
 includes/templates/UserLinks.mustache         |  2 +-
 .../components/UserLinks.less                 | 73 ++++++++++---------
 2 files changed, 38 insertions(+), 37 deletions(-)

diff --git a/includes/templates/UserLinks.mustache b/includes/templates/UserLinks.mustache
index c772e02f1..6ada638f9 100644
--- a/includes/templates/UserLinks.mustache
+++ b/includes/templates/UserLinks.mustache
@@ -1,6 +1,6 @@
 <div class="vector-user-links">
 	{{#is-anon}}
-		<div id="p-createaccount">
+		<div id="p-createaccount" class="vector-user-links-createaccount">
 			{{#data-userlinks}}{{{html-create-account}}}{{/data-userlinks}}
 		</div>
 	{{/is-anon}}
diff --git a/resources/skins.vector.styles/components/UserLinks.less b/resources/skins.vector.styles/components/UserLinks.less
index fd6524e80..4883e5517 100644
--- a/resources/skins.vector.styles/components/UserLinks.less
+++ b/resources/skins.vector.styles/components/UserLinks.less
@@ -60,13 +60,45 @@
 				text-decoration: none;
 			}
 		}
+
+		// Copied from https://github.com/wikimedia/Vector/blob/master/resources/common/components/MenuDropdown.less#L88
+		.vector-user-menu-anon-editor,
+		.vector-user-menu-login {
+			padding: 0.625em;
+			margin: 0;
+			font-size: @font-size-tabs;
+		}
+
+		// "Login" link in anonymous user menus
+		.vector-user-menu-login {
+			border-bottom: 1px solid @border-color-base;
+
+			&:hover {
+				background-color: @background-color-secondary;
+			}
+
+			a {
+				display: block;
+				color: #000;
+				text-decoration: none;
+			}
+		}
+
+		// "Log out" link in logged in user menus
+		// FIXME: Should not use ID selector. To be fixed as part of T281791.
+		#pt-logout {
+			border-top: 1px solid @border-color-base;
+		}
 	}
 
-	#p-createaccount {
-		margin-left: 0.75em;
+	.mw-portlet-notifications {
+		li {
+			float: left;
+			margin-left: 0.75em;
+		}
 	}
 
-	#p-user-page {
+	.mw-portlet-user-page {
 		li {
 			margin-left: 1em;
 			padding-bottom: 0.5em;
@@ -80,38 +112,7 @@
 		}
 	}
 
-	#p-notifications {
-		li {
-			float: left;
-			margin-left: 0.75em;
-		}
-	}
-
-	// Copied from https://github.com/wikimedia/Vector/blob/master/resources/common/components/MenuDropdown.less#L88
-	.vector-user-menu-anon-editor,
-	.vector-user-menu-login {
-		padding: 0.625em;
-		margin: 0;
-		font-size: @font-size-tabs;
-	}
-
-	// "Login" link in anonymous user menus
-	.vector-user-menu-login {
-		border-bottom: 1px solid @border-color-base;
-
-		&:hover {
-			background-color: @background-color-secondary;
-		}
-
-		a {
-			display: block;
-			color: #000;
-			text-decoration: none;
-		}
-	}
-
-	// "Log out" link in logged in user menus
-	#pt-logout {
-		border-top: 1px solid @border-color-base;
+	.vector-user-links-createaccount {
+		margin-left: 0.75em;
 	}
 }