From 26f89a02b3739f0aac1db80f28e044a5d6754142 Mon Sep 17 00:00:00 2001
From: grimsi <9295182+grimsi@users.noreply.github.com>
Date: Fri, 16 May 2025 17:30:21 +0200
Subject: [PATCH] Minor layout fixes and improvements

---
 .../frontend/components/general/CoverRow.tsx  |  5 ++--
 gameyfin/src/main/frontend/views/GameView.tsx | 24 ++++++++++---------
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/gameyfin/src/main/frontend/components/general/CoverRow.tsx b/gameyfin/src/main/frontend/components/general/CoverRow.tsx
index a5c959a..cf3dfbb 100644
--- a/gameyfin/src/main/frontend/components/general/CoverRow.tsx
+++ b/gameyfin/src/main/frontend/components/general/CoverRow.tsx
@@ -49,10 +49,9 @@ export function CoverRow({games, title, onPressShowMore}: CoverRowProps) {
             <div className="w-full relative">
                 <Card ref={containerRef} className="flex flex-row gap-2 bg-transparent" radius={radius}>
                     {games.slice(0, visibleCount).map((game, index) => (
-                        <div className="flex-shrink-0 cursor-pointer" key={index}
-                             onClick={() => navigate(`/game/${game.id}`)}>
+                        <a key={index} href={`/game/${game.id}`}>
                             <GameCover game={game} radius={radius} hover={true}/>
-                        </div>
+                        </a>
                     ))}
                 </Card>
 
diff --git a/gameyfin/src/main/frontend/views/GameView.tsx b/gameyfin/src/main/frontend/views/GameView.tsx
index 37ee1ae..42f7fbe 100644
--- a/gameyfin/src/main/frontend/views/GameView.tsx
+++ b/gameyfin/src/main/frontend/views/GameView.tsx
@@ -40,16 +40,16 @@ export default function GameView() {
 
     return (game && (
         <div className="flex flex-col gap-4">
-            {game.imageIds !== undefined && game.imageIds.length > 0 &&
-                <div className="overflow-hidden rounded-lg relative">
+            <div className="overflow-hidden relative rounded-t-lg">
+                {(game.imageIds !== undefined && game.imageIds.length > 0) ?
                     <img className="w-full h-96 object-cover brightness-50 blur-sm scale-110"
                          alt="Game screenshot"
                          src={`/images/screenshot/${game.imageIds[0]}`}
-                    />
-                    <div
-                        className="absolute inset-0 pointer-events-none bg-gradient-to-b from-transparent to-background"/>
-                </div>
-            }
+                    /> :
+                    <div className="w-full h-96 bg-secondary relative"/>
+                }
+                <div className="absolute inset-0 bg-gradient-to-b from-transparent to-background"/>
+            </div>
             <div className="flex flex-col gap-4 mx-24">
                 <div className="flex flex-row justify-between">
                     <div className="flex flex-row gap-4">
@@ -80,10 +80,12 @@ export default function GameView() {
                             <table className="text-left w-full table-auto">
                                 <tbody>
                                 {Object.entries({
-                                    "Developed by": game.developers?.sort().join(" / "),
-                                    "Published by": game.publishers?.sort().join(" / "),
-                                    "Genres": game.genres?.sort().map(p => <Chip radius="sm">{toTitleCase(p)}</Chip>),
-                                    "Themes": game.themes?.sort().map(p => <Chip radius="sm">{toTitleCase(p)}</Chip>),
+                                    "Developed by": game.developers?.sort().join(" / ") || "unknown",
+                                    "Published by": game.publishers?.sort().join(" / ") || "unknown",
+                                    "Genres": game.genres?.sort().map(p => <Chip
+                                        radius="sm">{toTitleCase(p)}</Chip>),
+                                    "Themes": game.themes?.sort().map(p => <Chip
+                                        radius="sm">{toTitleCase(p)}</Chip>),
                                     "Features": game.features?.sort().map(p => <Chip
                                         radius="sm">{toTitleCase(p)}</Chip>),
                                 }).map(([key, value]) => (