From b6119878ec477bdeefc9f30e18138b0856b24f82 Mon Sep 17 00:00:00 2001
From: Naiyuan Qing <145280634+NevilleQingNY@users.noreply.github.com>
Date: Sun, 29 Mar 2026 17:43:06 +0800
Subject: [PATCH] fix(ui): improve board card hover with shadow and text
 contrast

Cards now show muted title text by default that becomes full contrast on
hover, paired with a shadow-md elevation effect. Removes the old
opacity-based hover that made cards fade out.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 apps/web/features/issues/components/board-card.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/web/features/issues/components/board-card.tsx b/apps/web/features/issues/components/board-card.tsx
index 8c0537ca..d418b103 100644
--- a/apps/web/features/issues/components/board-card.tsx
+++ b/apps/web/features/issues/components/board-card.tsx
@@ -62,7 +62,7 @@ export function BoardCardContent({
   const showBottom = showAssignee || showDueDate;
 
   return (
-    <div className="rounded-lg border bg-card p-3.5 shadow-[0_1px_2px_0_rgba(0,0,0,0.03)]">
+    <div className="rounded-lg border bg-card p-3.5 shadow-[0_1px_2px_0_rgba(0,0,0,0.03)] transition-shadow group-hover:shadow-md">
       {/* Priority */}
       {showPriority &&
         (editable ? (
@@ -91,7 +91,7 @@ export function BoardCardContent({
 
       {/* Title */}
       <p
-        className={`text-sm font-medium leading-snug line-clamp-2 ${showPriority ? "mt-2" : ""}`}
+        className={`text-sm font-medium leading-snug line-clamp-2 text-muted-foreground transition-colors group-hover:text-foreground ${showPriority ? "mt-2" : ""}`}
       >
         {issue.title}
       </p>
@@ -197,7 +197,7 @@ export function DraggableBoardCard({ issue }: { issue: Issue }) {
     >
       <Link
         href={`/issues/${issue.id}`}
-        className={`block transition-colors hover:opacity-80 ${isDragging ? "pointer-events-none" : ""}`}
+        className={`group block transition-colors ${isDragging ? "pointer-events-none" : ""}`}
       >
         <BoardCardContent issue={issue} editable />
       </Link>