From 9aaed392dcb1e5201397d6bece1a606937b71a9d Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Sat, 10 Feb 2024 16:25:22 -0600
Subject: [PATCH] Refine admin more menu

---
 src/admin/AdminPhotoMenuClient.tsx | 16 ++++++++++------
 src/components/MoreMenu.tsx        |  6 +++---
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/admin/AdminPhotoMenuClient.tsx b/src/admin/AdminPhotoMenuClient.tsx
index c90fddb0..6f72e2b1 100644
--- a/src/admin/AdminPhotoMenuClient.tsx
+++ b/src/admin/AdminPhotoMenuClient.tsx
@@ -4,10 +4,9 @@ import { ComponentProps } from 'react';
 import { pathForAdminPhotoEdit } from '@/site/paths';
 import MoreMenu from '../components/MoreMenu';
 import { toggleFavoritePhoto } from '@/photo/actions';
-import { FaRegEdit, FaStar } from 'react-icons/fa';
+import { FaRegEdit, FaRegStar, FaStar } from 'react-icons/fa';
 import { Photo } from '@/photo';
 import { isPathFavs, isPhotoFav } from '@/tag';
-import clsx from 'clsx/lite';
 import { usePathname } from 'next/navigation';
 
 export default function AdminPhotoMenuClient({
@@ -28,10 +27,15 @@ export default function AdminPhotoMenuClient({
           href: pathForAdminPhotoEdit(photo.id),
         }, {
           label: isFav ? 'Unfavorite' : 'Favorite',
-          icon: <FaStar stroke='text-amber-500' className={clsx(
-            'translate-x-[-1px]',
-            isFav && 'text-amber-500',
-          )} />,
+          icon: isFav
+            ? <FaStar
+              size={14}
+              className="translate-y-[-1px] text-amber-500"
+            />
+            : <FaRegStar
+              size={14}
+              className="translate-x-[-1px]"
+            />,
           action: () => toggleFavoritePhoto(photo.id, shouldRedirect),
         },
       ],
diff --git a/src/components/MoreMenu.tsx b/src/components/MoreMenu.tsx
index 8c41ab1a..1a5a7480 100644
--- a/src/components/MoreMenu.tsx
+++ b/src/components/MoreMenu.tsx
@@ -29,6 +29,7 @@ export default function MoreMenu({
     'hover:bg-gray-50 active:bg-gray-100',
     'hover:dark:bg-gray-900/75 active:dark:bg-gray-900',
     'whitespace-nowrap',
+    'shadow-none',
     isLoading && 'cursor-not-allowed opacity-50',
   );
 
@@ -56,11 +57,10 @@ export default function MoreMenu({
           <FiMoreHorizontal size={18} />
         </Menu.Button>
         <Menu.Items className={clsx(
-          'block outline-none h-auto',
           'absolute top-6',
-          'text-left',
+          'min-w-[9rem]',
+          'text-sm text-left',
           'md:right-1',
-          'text-sm',
           'p-1 rounded-md border',
           'bg-content',
           'shadow-lg dark:shadow-xl',