From adba8489f299bfbe58f6477220f8f3192ace50da Mon Sep 17 00:00:00 2001
From: Rohinish <singhrohinish09@gmail.com>
Date: Mon, 26 Feb 2024 11:10:34 +0530
Subject: [PATCH] fix(ui): made changes to avoid overlapping

---
 .../gallery/components/ImageGrid/GalleryImage.tsx   | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImage.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImage.tsx
index cf6f285b26..568be36e4c 100644
--- a/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImage.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImage.tsx
@@ -158,15 +158,14 @@ const GalleryImage = (props: HoverableImageProps) => {
             {isHovered && (
               <Text
                 position="absolute"
-                background="white"
-                color="black"
-                fontSize="base.50"
-                bottom={0}
-                right={0}
+                background="black"
+                color="white"
+                fontSize="12px"
+                bottom={1.5}
+                right={8}
                 px={2}
                 opacity={0.7}
-                borderTopLeftRadius="base"
-                borderBottomRightRadius="base"
+                borderRadius="base"
                 sx={badgeSx}
               >{`${imageDTO.width}x${imageDTO.height}`}</Text>)}
             <IAIDndImageIcon onClick={toggleStarredState} icon={starIcon} tooltip={starTooltip} />