From 3bb049946b1ab8529c81456384f0a5ef2b7e0422 Mon Sep 17 00:00:00 2001
From: Antoine Phan <hoangtuan11102@gmail.com>
Date: Mon, 9 Feb 2026 00:27:47 -0500
Subject: [PATCH] Minor adjustment to the alt text and layout

---
 src/components/council/CouncilAvatar.svelte    | 7 ++++++-
 src/components/council/CouncilCard.svelte      | 2 +-
 src/components/council/CouncilCardPopUp.svelte | 2 +-
 src/routes/council/+page.svelte                | 2 +-
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/council/CouncilAvatar.svelte b/src/components/council/CouncilAvatar.svelte
index bcf7f4c..7fd3e26 100644
--- a/src/components/council/CouncilAvatar.svelte
+++ b/src/components/council/CouncilAvatar.svelte
@@ -20,7 +20,12 @@
 	class="bg-ecsess-600/50 relative aspect-square size-20 overflow-hidden rounded-full sm:size-24"
 >
 	{#if src && !imageError}
-		<img {src} alt={name} class="h-full w-full object-cover" onerror={handleImageError} />
+		<img
+			{src}
+			alt={`Profile picture of ${name}`}
+			class="h-full w-full object-cover"
+			onerror={handleImageError}
+		/>
 	{:else}
 		<div
 			class="bg-ecsess-500 text-ecsess-950 flex h-full w-full items-center justify-center text-lg font-bold"
diff --git a/src/components/council/CouncilCard.svelte b/src/components/council/CouncilCard.svelte
index db68c46..bba0fed 100644
--- a/src/components/council/CouncilCard.svelte
+++ b/src/components/council/CouncilCard.svelte
@@ -33,7 +33,7 @@
 		{#if image && !imageError}
 			<img
 				src={image}
-				alt={name}
+				alt={`Profile picture of ${name} for the position of ${position}`}
 				class="h-full w-full object-cover object-center"
 				onerror={handleImageError}
 			/>
diff --git a/src/components/council/CouncilCardPopUp.svelte b/src/components/council/CouncilCardPopUp.svelte
index 751a98a..93c4e7a 100644
--- a/src/components/council/CouncilCardPopUp.svelte
+++ b/src/components/council/CouncilCardPopUp.svelte
@@ -44,7 +44,7 @@
 			{#if image && !imageError}
 				<img
 					src={image}
-					alt={name}
+					alt={`Profile picture of ${name} for the position of ${position}`}
 					class="h-full w-full object-cover object-center"
 					onerror={handleImageError}
 				/>
diff --git a/src/routes/council/+page.svelte b/src/routes/council/+page.svelte
index cb14e89..acdbf38 100644
--- a/src/routes/council/+page.svelte
+++ b/src/routes/council/+page.svelte
@@ -181,7 +181,7 @@
 		<div
 			bind:this={modalRef}
 			tabindex="-1"
-			class="fixed inset-0 z-50 flex items-center justify-center overflow-y-auto bg-black/70 p-4 backdrop-blur-sm outline-none"
+			class="focus-visible:ring-ecsess-400 fixed inset-0 z-50 flex items-center justify-center overflow-y-auto bg-black/70 p-4 backdrop-blur-sm outline-none focus-visible:ring-2 focus-visible:ring-inset"
 			role="dialog"
 			aria-modal="true"
 			aria-labelledby="popup-title"