From 348bef556221d0badddfc793b63a9d35a19a4644 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A1redy=20Alves?= <gitsigning@undefinedname.com>
Date: Fri, 24 Nov 2023 16:17:27 +0000
Subject: [PATCH] style: Improve responsiveness of Genre buttons grid

- Adjusted the grid template columns in the .btn-grid class for better responsiveness.
- Removed the max-width and grid-auto-rows properties to allow flexible sizing.
- Removed the media query for screens with a maximum width of 600px.
---
 src/components/Genres.vue | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/components/Genres.vue b/src/components/Genres.vue
index e4cc46b..d56274b 100644
--- a/src/components/Genres.vue
+++ b/src/components/Genres.vue
@@ -124,10 +124,7 @@ onMounted(get);
 }
 .btn-grid {
   display: grid;
-  align-self: center;
-  max-width: 100%;
-  grid-template-columns: repeat(auto-fill, 8rem);
-  grid-auto-rows: 1fr;
+  grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
   gap: 0.125rem;
   padding: 1rem 0;
 }
@@ -154,9 +151,4 @@ onMounted(get);
   text-align: center;
   text-transform: capitalize;
 }
-@media (max-width: 600px) {
-  .btn-grid {
-    grid-template-columns: repeat(3, 1fr);
-  }
-}
 </style>