From db16ca00798e80a214628d67e3595133b839330e Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Thu, 27 Apr 2023 15:12:44 +1200
Subject: [PATCH] fix(ui): Current Image Buttons position

---
 .../components/CurrentImageDisplay.tsx        | 27 +++++++++++--------
 1 file changed, 16 insertions(+), 11 deletions(-)

diff --git a/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx b/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
index 1730b41095..64f78836e8 100644
--- a/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/CurrentImageDisplay.tsx
@@ -60,29 +60,34 @@ const CurrentImageDisplay = () => {
       }}
     >
       <Flex
+        flexDirection="column"
         sx={{
           w: 'full',
           h: 'full',
           alignItems: 'center',
-          justifyContent: 'center',
           gap: 4,
         }}
       >
+        <CurrentImageButtons />
         {hasAnImageToDisplay ? (
           <CurrentImagePreview />
         ) : (
-          <Icon
-            as={MdPhoto}
-            sx={{
-              boxSize: 24,
-              color: 'base.500',
-            }}
-          />
+          <Flex
+            width="full"
+            height="full"
+            alignItems="center"
+            justifyContent="center"
+          >
+            <Icon
+              as={MdPhoto}
+              sx={{
+                boxSize: 24,
+                color: 'base.500',
+              }}
+            />
+          </Flex>
         )}
       </Flex>
-      <Box sx={{ position: 'absolute', top: 0 }}>
-        <CurrentImageButtons />
-      </Box>
     </Flex>
   );
 };