From ec7f9b99505d49c715b7eb64010b66119a21cd45 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Mon, 6 Feb 2023 17:00:25 -0600
Subject: [PATCH] ProfileDropdown: fix hover styles for menu items with
 `action`

---
 app/soapbox/features/ui/components/profile-dropdown.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/soapbox/features/ui/components/profile-dropdown.tsx b/app/soapbox/features/ui/components/profile-dropdown.tsx
index 03dce6d55..732d35994 100644
--- a/app/soapbox/features/ui/components/profile-dropdown.tsx
+++ b/app/soapbox/features/ui/components/profile-dropdown.tsx
@@ -158,7 +158,7 @@ interface MenuItemProps {
 }
 
 const MenuItem: React.FC<MenuItemProps> = ({ className, menuItem }) => {
-  const baseClassName = clsx(className, 'block cursor-pointer truncate px-4 py-2.5 text-sm text-gray-700 dark:text-gray-500');
+  const baseClassName = clsx(className, 'block w-full cursor-pointer truncate px-4 py-2.5 text-left text-sm text-gray-700 hover:bg-gray-100 rtl:text-right dark:text-gray-500 dark:hover:bg-gray-800');
 
   if (menuItem.toggle) {
     return (
@@ -184,7 +184,7 @@ const MenuItem: React.FC<MenuItemProps> = ({ className, menuItem }) => {
     return (
       <Link
         to={menuItem.to}
-        className={clsx(baseClassName, 'hover:bg-gray-100 dark:hover:bg-gray-800')}
+        className={baseClassName}
       >
         {menuItem.text}
       </Link>