From 066e50f8b58d7f8a0d5f46b23262e9fbae5eeebf Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@zoriya.dev>
Date: Sat, 4 Apr 2026 10:51:56 +0200
Subject: [PATCH] Add borders on hover to staff cards

---
 front/src/ui/details/staff.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/front/src/ui/details/staff.tsx b/front/src/ui/details/staff.tsx
index 79b0b4c4..41a2fa39 100644
--- a/front/src/ui/details/staff.tsx
+++ b/front/src/ui/details/staff.tsx
@@ -21,11 +21,17 @@ export const CharacterCard = ({
 	return (
 		<Link
 			href={href}
-			className="flex-row items-center overflow-hidden rounded-xl bg-card"
+			className={cn(
+				"flex-row items-center overflow-hidden rounded-xl bg-card",
+				"group ring-accent hover:ring-3 focus-visible:ring-3",
+			)}
 		>
 			<Poster src={image} quality="low" className="w-28" />
 			<View className="flex-1 items-center justify-center py-5">
-				<P className="text-center font-semibold" numberOfLines={2}>
+				<P
+					className="text-center font-semibold group-hover:underline group-focus-visible:underline"
+					numberOfLines={2}
+				>
 					{name}
 				</P>
 				<SubP className="mt-1 text-center" numberOfLines={2}>