From f7f9862489c80bfc9d30cf9c8ced1015692654f2 Mon Sep 17 00:00:00 2001
From: DebaucheryLibrarian <moonloop.adult@protonmail.com>
Date: Sat, 23 Jan 2021 23:56:24 +0100
Subject: [PATCH] Improved album width on narrow screens.

---
 assets/components/album/album.vue | 10 ++--------
 assets/css/_breakpoints.scss      |  1 +
 2 files changed, 3 insertions(+), 8 deletions(-)

diff --git a/assets/components/album/album.vue b/assets/components/album/album.vue
index 51cf5806..09909dc3 100644
--- a/assets/components/album/album.vue
+++ b/assets/components/album/album.vue
@@ -122,15 +122,9 @@ export default {
 	margin: 0 0 1rem 0;
 }
 
-@media(max-width: $breakpoint) {
+@media(max-width: $breakpoint-pico) {
 	.album-items {
-		grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
-	}
-}
-
-@media(max-width: $breakpoint-nano) {
-	.album-items {
-		grid-template-columns: repeat(auto-fill, 1fr);
+		grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
 	}
 }
 </style>
diff --git a/assets/css/_breakpoints.scss b/assets/css/_breakpoints.scss
index 6dbfb0f2..7afef7e5 100644
--- a/assets/css/_breakpoints.scss
+++ b/assets/css/_breakpoints.scss
@@ -1,3 +1,4 @@
+$breakpoint-pico: 270px;
 $breakpoint-nano: 320px;
 $breakpoint-micro: 540px;
 $breakpoint-small: 620px;