From 9e449f08006760f8fc1909c3d70b46591ae207c3 Mon Sep 17 00:00:00 2001
From: John Beresford <jberesford@volcaus.com>
Date: Sat, 16 Nov 2024 19:34:34 -0800
Subject: [PATCH] fix progress bar on install btn

---
 .../src/components/action-button/install-game-button.tsx    | 6 +-----
 packages/client/web/src/components/game-list.tsx            | 2 +-
 .../_fullscreenLayout/fullscreen/games/$gameId.lazy.tsx     | 5 +++--
 3 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/packages/client/web/src/components/action-button/install-game-button.tsx b/packages/client/web/src/components/action-button/install-game-button.tsx
index 6652ef8d..63fb9b7d 100644
--- a/packages/client/web/src/components/action-button/install-game-button.tsx
+++ b/packages/client/web/src/components/action-button/install-game-button.tsx
@@ -57,11 +57,7 @@ export const InstallGameButton = forwardRef(
       }
 
       if (installState === InstallationStatus.INSTALLING) {
-        return (
-          <div className="absolute inset-0 grid place-items-center px-2">
-            <Progress value={installProgress} className="h-2" />
-          </div>
-        );
+        return <Progress value={installProgress} className="h-2" />;
       }
 
       return (
diff --git a/packages/client/web/src/components/game-list.tsx b/packages/client/web/src/components/game-list.tsx
index fa4c2e09..3f1169dc 100644
--- a/packages/client/web/src/components/game-list.tsx
+++ b/packages/client/web/src/components/game-list.tsx
@@ -63,7 +63,7 @@ export function GameList(props: { games: GameWithMetadata[] }) {
                     <div className="rounded-md overflow-hidden w-fit pointer-events-auto touch-auto z-50">
                       <ActionButton
                         size="sm"
-                        className="text-md min-w-[100px]"
+                        className='text-md min-w-[100px] [&_div[role="progressbar"]_>_*]:bg-primary-foreground'
                         game={game}
                       />
                     </div>
diff --git a/packages/client/web/src/routes/_fullscreenLayout/fullscreen/games/$gameId.lazy.tsx b/packages/client/web/src/routes/_fullscreenLayout/fullscreen/games/$gameId.lazy.tsx
index 6c40d7bf..9bb5591e 100644
--- a/packages/client/web/src/routes/_fullscreenLayout/fullscreen/games/$gameId.lazy.tsx
+++ b/packages/client/web/src/routes/_fullscreenLayout/fullscreen/games/$gameId.lazy.tsx
@@ -88,8 +88,9 @@ function Inner() {
                       }}
                       game={game}
                       className={cn(
-                        "w-auto text-5xl h-[unset] *:first:hidden uppercase px-8 py-4",
-                        "opacity-80 focus-hover:opacity-100 transition-all",
+                        "w-auto text-5xl h-[unset] [&_svg]:hidden uppercase px-8 py-4",
+                        "opacity-80 focus-hover:opacity-100 transition-all h-full",
+                        '[&_div[role="progressbar"]]:w-[6ch] [&_div[role="progressbar"]_>_*]:bg-primary-foreground',
                       )}
                     />
                   </HotkeyLayer>