From 31241d8d1236ccbeeec53bf1de6568a8f2543f51 Mon Sep 17 00:00:00 2001
From: Dorian <dorian@Dorians-MacBook-Air.local>
Date: Wed, 4 Mar 2026 22:47:35 +0000
Subject: [PATCH] fix(a11y): improve img alt text with artist/director/author
 context

Updates alt attributes to include contextual info: songs include artist,
films include year and director, books include author, TV series include
type label.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 packages/app/src/components/content/BookGrid.vue     | 2 +-
 packages/app/src/components/content/FilmGrid.vue     | 2 +-
 packages/app/src/components/content/SongGrid.vue     | 2 +-
 packages/app/src/components/content/TVSeriesGrid.vue | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/app/src/components/content/BookGrid.vue b/packages/app/src/components/content/BookGrid.vue
index dd85bd5b..ae2ae564 100644
--- a/packages/app/src/components/content/BookGrid.vue
+++ b/packages/app/src/components/content/BookGrid.vue
@@ -57,7 +57,7 @@
               <img
                 v-if="coverSrc(book)"
                 :src="coverSrc(book)!"
-                :alt="book.title"
+                :alt="`${book.title} by ${book.author}`"
                 class="w-full h-full object-cover transition-transform duration-300 group-hover:scale-110"
                 loading="lazy"
                 @error="onCoverError(book)"
diff --git a/packages/app/src/components/content/FilmGrid.vue b/packages/app/src/components/content/FilmGrid.vue
index 0e5f5374..defbaf0e 100644
--- a/packages/app/src/components/content/FilmGrid.vue
+++ b/packages/app/src/components/content/FilmGrid.vue
@@ -57,7 +57,7 @@
               <img
                 v-if="coverSrc(film)"
                 :src="coverSrc(film)!"
-                :alt="film.title"
+                :alt="`${film.title} (${film.year}) directed by ${film.director}`"
                 class="w-full h-full object-cover transition-transform duration-300 group-hover:scale-110"
                 loading="lazy"
                 @error="onCoverError(film)"
diff --git a/packages/app/src/components/content/SongGrid.vue b/packages/app/src/components/content/SongGrid.vue
index 6bc09262..c05ad514 100644
--- a/packages/app/src/components/content/SongGrid.vue
+++ b/packages/app/src/components/content/SongGrid.vue
@@ -68,7 +68,7 @@
               <img
                 v-if="coverSrc(song)"
                 :src="coverSrc(song)!"
-                :alt="song.title"
+                :alt="`${song.title} by ${song.artist}`"
                 class="w-full h-full object-cover transition-transform duration-300 group-hover:scale-110"
                 loading="lazy"
                 @error="onCoverError(song)"
diff --git a/packages/app/src/components/content/TVSeriesGrid.vue b/packages/app/src/components/content/TVSeriesGrid.vue
index bede118d..47a4dd72 100644
--- a/packages/app/src/components/content/TVSeriesGrid.vue
+++ b/packages/app/src/components/content/TVSeriesGrid.vue
@@ -57,7 +57,7 @@
               <img
                 v-if="coverSrc(s)"
                 :src="coverSrc(s)!"
-                :alt="s.title"
+                :alt="`${s.title} — TV Series`"
                 class="w-full h-full object-cover transition-transform duration-300 group-hover:scale-110"
                 loading="lazy"
                 @error="onCoverError(s)"