From b86cf8e30fc0370847c28908fc60a0d8ea3e7dfe Mon Sep 17 00:00:00 2001
From: DebaucheryLibrarian <DebaucheryLibrarian@unknown.name>
Date: Fri, 24 Jul 2026 00:33:56 +0200
Subject: [PATCH] Added grid rule to prevent row gaps on large screens.

---
 assets/css/breakpoints.css   | 2 ++
 components/actors/actors.vue | 1 +
 components/movies/movies.vue | 2 +-
 components/scenes/scenes.vue | 1 +
 pages/tags/+Page.vue         | 1 +
 5 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/assets/css/breakpoints.css b/assets/css/breakpoints.css
index fdde6dd..1f7a194 100644
--- a/assets/css/breakpoints.css
+++ b/assets/css/breakpoints.css
@@ -8,3 +8,5 @@
 @custom-media --small (max-width: 900px);
 @custom-media --compact (max-width: 1200px);
 @custom-media --big (max-width: 1500px);
+@custom-media --big-10 (max-width: 1750px);
+@custom-media --big-20 (max-width: 2000px);
diff --git a/components/actors/actors.vue b/components/actors/actors.vue
index d567eee..7de8aed 100644
--- a/components/actors/actors.vue
+++ b/components/actors/actors.vue
@@ -303,6 +303,7 @@ function updateFilter(prop, value, reload = true) {
 	display: grid;
 	flex-grow: 1;
 	grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
+	grid-auto-rows: max-content; /* prevent row gaps on large screens */
 	gap: .25rem;
 }
 
diff --git a/components/movies/movies.vue b/components/movies/movies.vue
index c65922e..e8294d8 100644
--- a/components/movies/movies.vue
+++ b/components/movies/movies.vue
@@ -279,7 +279,7 @@ function updateFilter(prop, value, reload = true) {
 .movies {
 	display: grid;
 	grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
-	gap: 1rem;
+	gap: .5rem;
 	padding: .5rem 1rem 1rem 1rem;
 }
 
diff --git a/components/scenes/scenes.vue b/components/scenes/scenes.vue
index 1bb9fbe..0493cdf 100644
--- a/components/scenes/scenes.vue
+++ b/components/scenes/scenes.vue
@@ -447,6 +447,7 @@ function setView(newView) {
 .scenes {
 	display: grid;
     grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
+	grid-auto-rows: min-content;
 	gap: .5rem;
 	padding: .5rem 1rem 1rem 1rem;
 }
diff --git a/pages/tags/+Page.vue b/pages/tags/+Page.vue
index ed798c0..504505d 100644
--- a/pages/tags/+Page.vue
+++ b/pages/tags/+Page.vue
@@ -279,6 +279,7 @@ onMounted(() => {
 .tags {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
+	grid-auto-rows: max-content; /* prevent row gaps on large screens */
     gap: 1rem .5rem;
 	padding: .75rem 1rem;
 }