From ddfc9fd89d828fe3a3c43d9f6a1b43f7e505669c Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Fri, 26 Apr 2024 16:40:29 -0700
Subject: feat(schedule): use grid

---
 src/routes/schedule/+page.svelte | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

(limited to 'src/routes')

diff --git a/src/routes/schedule/+page.svelte b/src/routes/schedule/+page.svelte
index d689eee7..0617f472 100644
--- a/src/routes/schedule/+page.svelte
+++ b/src/routes/schedule/+page.svelte
@@ -10,7 +10,6 @@
 	// import Crunchyroll from '$lib/Schedule/Crunchyroll.svelte';
 	import '$lib/Schedule/container.css';
 	import Days from '$lib/Schedule/Days.svelte';
-	import settings from '$stores/settings';
 	import Skeleton from '$lib/Loading/Skeleton.svelte';
 	import Message from '$lib/Loading/Message.svelte';
 	import subsPlease from '$stores/subsPlease';
@@ -64,15 +63,7 @@
 		<Skeleton grid={true} count={7} height="15em" width="49.5%" />
 	{:then scheduledMedia}
 		{#if scheduledMedia}
-			{@const columnCount = Math.ceil(Object.keys($subsPlease.schedule).length / 2)}
-
-			<div
-				class="list-container"
-				id="schedule"
-				style={`column-count: ${
-					columnCount / ($settings.displayScheduleListMode || forceListMode ? 1 : 2)
-				}`}
-			>
+			<div class="schedule-container" id="schedule">
 				<Days subsPlease={$subsPlease} {scheduledMedia} {forceListMode} />
 			</div>
 		{:else}
@@ -84,3 +75,11 @@
 		<Error type="Media" loginSessionError={false} card list={false} />
 	{/await}
 {/if}
+
+<style>
+	.schedule-container {
+		display: grid;
+		grid-template-columns: repeat(auto-fill, minmax(35%, 1fr));
+		gap: 0.5em;
+	}
+</style>
-- 
cgit v1.2.3