fix: store style & library game page

pages/library/game/[id]/index.vue

@@ -79,19 +79,19 @@ import {
 import { type Game, type GameVersion, type Collection } from "@prisma/client";
 
 const route = useRoute();
-const headers = useRequestHeaders(["cookie"]);
-const { data: gamesData } = await useFetch<
-  (Game & { versions: GameVersion[] })[]
->("/api/v1/store/recent", { headers });
 
 const collections = await useCollections();
-const game = collections.value
+const library = await useLibrary();
+const game = [...collections.value, library.value]
   .map((e) => e.entries.map((e) => e.game))
   .flat()
   .find((e) => e.id == route.params.id);
 
 if (game === undefined)
-  throw createError({ statusCode: 404, statusMessage: "Game not found" });
+  throw createError({
+    statusCode: 404,
+    statusMessage: JSON.stringify(collections.value),
+  });
 </script>
 
 <style scoped>

pages/store/index.vue

@@ -30,10 +30,11 @@
               >
                 {{ game.mName }}
               </h2>
-              <p class="mt-3 text-lg text-zinc-300 line-clamp-2">
+              <p class="mt-3 text-lg text-zinc-300 line-clamp-2 max-w-xl">
                 {{ game.mShortDescription }}
               </p>
-              <div class="mt-8 grid grid-cols-1 lg:grid-cols-2 gap-4">
+              <div>
+                <div class="mt-8 grid grid-cols-1 lg:grid-cols-2 gap-4 w-fit mx-auto">
                   <NuxtLink
                     :href="`/store/${game.id}`"
                     class="block w-full rounded-md border border-transparent bg-white px-8 py-3 text-base font-medium text-gray-900 hover:bg-gray-100 sm:w-auto"
@@ -44,6 +45,7 @@
               </div>
             </div>
           </div>
+        </div>
       </VueSlide>
 
       <template #addons>