From d55a3f01c1c96ba8c1fc7ffd713fb307d6ca7c09 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Mon, 4 Sep 2023 02:00:54 -0700
Subject: feat(home): response columns

---
 src/routes/+page.svelte | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

(limited to 'src/routes/+page.svelte')

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 1e49411e..e981ea3f 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -79,13 +79,28 @@
 </div>
 
 <style>
-	.list {
-		width: 100%;
+	#list-container {
+		display: flex;
+		flex-wrap: wrap;
 	}
 
-	@media (min-width: 960px) {
-		#list-container {
-			display: flex;
+	/* (1440 / 2) + (1440/8) = 720 + 180 = 900 */
+	@media (max-width: 900px) {
+		.list {
+			flex: 0 0 100%;
+		}
+	}
+
+	/* (1920 / 2) + (1920 / 4) = 960 + 480 = 1440 */
+	@media (min-width: 901px) and (max-width: 1440px) {
+		.list {
+			flex: 0 0 50%;
+		}
+	}
+
+	@media (min-width: 1441px) {
+		.list {
+			flex: 0 0 33.33%;
 		}
 	}
 </style>
-- 
cgit v1.2.3

