From dce116b66ff2e492c538bef9333c9494606902b1 Mon Sep 17 00:00:00 2001
From: Aden Lindsay <140392385+AdenMGB@users.noreply.github.com>
Date: Tue, 28 Jan 2025 19:23:24 +1030
Subject: [PATCH] style(collections): Hover state & scaling games grid properly

---
 pages/library/collection/[id]/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/library/collection/[id]/index.vue b/pages/library/collection/[id]/index.vue
index 22c4444..78d27a9 100644
--- a/pages/library/collection/[id]/index.vue
+++ b/pages/library/collection/[id]/index.vue
@@ -4,7 +4,7 @@
       <div class="flex items-center gap-x-3 mb-4">
         <NuxtLink
           to="/library"
-          class="transition text-sm/6 font-semibold text-zinc-400 hover:text-zinc-100 inline-flex gap-x-2 items-center"
+          class="transition text-sm/6 font-semibold text-zinc-400 hover:text-zinc-100 inline-flex gap-x-2 items-center duration-200 hover:scale-105"
         >
           <ArrowLeftIcon class="h-4 w-4" aria-hidden="true" />
           Back to Collections
@@ -20,7 +20,7 @@
 
     <!-- Games grid -->
     <div
-      class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-4"
+      class="mt-4 flex flex-row gap-4 flex-wrap justify-center sm:justify-start"
     >
       <GamePanel
         v-for="entry in collection?.entries"