feat(manga): cover mode

1 files changed, 2 insertions, 52 deletions

diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte
index 402e22d9..eda46d28 100644
--- a/src/lib/List/Anime/CleanAnimeList.svelte
+++ b/src/lib/List/Anime/CleanAnimeList.svelte
@@ -16,6 +16,7 @@
 	import { browser } from '$app/environment';
 	import identity from '$stores/identity';
 	import Tooltip from './Tooltip.svelte';
+	import '../covers.css';
 
 	export let media: Media[];
 	export let title: any;
@@ -80,7 +81,7 @@
 	</button>
 {/if}
 
-{#if $settings.displayCoverMode}
+{#if $settings.displayCoverModeAnime}
 	<div
 		class="covers"
 		style={`grid-template-columns: repeat(auto-fill, minmax(${$settings.displayCoverWidth}px, 1fr))`}
@@ -225,54 +226,3 @@
 		{/each}
 	</ul>
 {/if}
-
-<style>
-	.covers {
-		display: grid;
-		justify-content: center;
-		gap: 1em 0.5em;
-		margin-top: 0.5rem;
-	}
-
-	.cover {
-		background-size: cover;
-		background-position: center;
-		border-radius: 8px;
-	}
-
-	.cover-title {
-		text-align: center;
-		margin: 0.25rem;
-	}
-
-	.cover-card {
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		transition: transform 0.3s ease;
-		box-sizing: border-box;
-		display: inline-block;
-		padding: 0.1em;
-		margin: -0.1em;
-		box-sizing: content-box;
-	}
-
-	.cover-card:hover {
-		transform: scale(1.1);
-		position: relative;
-		z-index: 2;
-		transition: transform 0.3s ease;
-	}
-
-	.entry::after {
-		content: '';
-		display: table;
-		clear: both;
-	}
-
-	.countdown {
-		white-space: nowrap;
-		float: right;
-	}
-</style>