From c759f72fe1d6562d41f9db16da0ea4be3ab2733a Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Fri, 2 Feb 2024 23:14:35 -0800
Subject: feat(cover-card): expand on hover

---
 src/lib/List/Anime/CleanAnimeList.svelte | 18 +++++++++++-------
 src/lib/Schedule/Days.svelte             |  9 +++++++++
 2 files changed, 20 insertions(+), 7 deletions(-)

(limited to 'src/lib')

diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte
index f73c7b23..0ca113f5 100644
--- a/src/lib/List/Anime/CleanAnimeList.svelte
+++ b/src/lib/List/Anime/CleanAnimeList.svelte
@@ -89,13 +89,8 @@
 			{@const progress = (anime.mediaListEntry || { progress: 0 }).progress}
 
 			{#if upcoming || notYetReleased || progress !== (anime.nextAiringEpisode?.episode || 9999) - 1}
-				<div class="cover-card">
-					<a
-						href={outboundLink(anime, 'anime', $settings.displayOutboundLinksTo)}
-						target="_blank"
-						title={anime ? mediaTitle(anime) : undefined}
-						use:tooltip
-					>
+				<div class="cover-card" title={anime ? mediaTitle(anime) : undefined} use:tooltip>
+					<a href={outboundLink(anime, 'anime', $settings.displayOutboundLinksTo)} target="_blank">
 						<img class="cover" src={anime.coverImage.extraLarge} alt="Cover" />
 					</a>
 
@@ -259,6 +254,15 @@
 		flex-direction: column;
 		justify-content: center;
 		align-items: center;
+		transition: transform 0.3s ease;
+		box-sizing: border-box;
+	}
+
+	.cover-card:hover {
+		transform: scale(1.1);
+		position: relative;
+		z-index: 2;
+		transition: transform 0.3s ease;
 	}
 
 	.entry::after {
diff --git a/src/lib/Schedule/Days.svelte b/src/lib/Schedule/Days.svelte
index d4dd068d..553a753e 100644
--- a/src/lib/Schedule/Days.svelte
+++ b/src/lib/Schedule/Days.svelte
@@ -160,6 +160,15 @@
 		flex-direction: column;
 		justify-content: center;
 		align-items: center;
+		transition: transform 0.3s ease;
+		box-sizing: border-box;
+	}
+
+	.cover-card:hover {
+		transform: scale(1.1);
+		position: relative;
+		z-index: 2;
+		transition: transform 0.3s ease;
 	}
 
 	.cover-title {
-- 
cgit v1.2.3