From f98795abfd12460d7e03444540ff09770da1149f Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Fri, 2 May 2025 07:44:45 -0500
Subject: [PATCH] Face UI fixes (#18000)

* ensure portrait cams are contained in dialog

* always show rename and delete buttons on mobile and tablet

without a group-hover state, a double-tap was required to select a face from the dropdown
---
 web/src/pages/FaceLibrary.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/pages/FaceLibrary.tsx b/web/src/pages/FaceLibrary.tsx
index ef06764ef..6586e1c5c 100644
--- a/web/src/pages/FaceLibrary.tsx
+++ b/web/src/pages/FaceLibrary.tsx
@@ -497,7 +497,7 @@ function LibrarySelector({
                     <Button
                       variant="ghost"
                       size="icon"
-                      className="size-7 opacity-0 transition-opacity group-hover:opacity-100"
+                      className="size-7 lg:opacity-0 lg:transition-opacity lg:group-hover:opacity-100"
                       onClick={(e) => {
                         e.stopPropagation();
                         setRenameFace(face);
@@ -515,7 +515,7 @@ function LibrarySelector({
                     <Button
                       variant="ghost"
                       size="icon"
-                      className="size-7 opacity-0 transition-opacity group-hover:opacity-100"
+                      className="size-7 lg:opacity-0 lg:transition-opacity lg:group-hover:opacity-100"
                       onClick={(e) => {
                         e.stopPropagation();
                         setConfirmDelete(face);
@@ -661,7 +661,7 @@ function TrainingGrid({
             <div className="text-sm">{formattedDate}</div>
           </div>
           <img
-            className="w-full"
+            className="mx-auto max-h-[60dvh] object-contain"
             loading="lazy"
             src={`${baseUrl}api/events/${selectedEvent?.id}/${selectedEvent?.has_snapshot ? "snapshot.jpg" : "thumbnail.jpg"}`}
           />