From a221ab2fb601c6d9dd32c717a1e788b320d30303 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 24 Jul 2024 06:30:29 +1000
Subject: [PATCH] fix(ui): upsell menuitem styling

---
 .../SettingsModal/SettingsUpsellMenuItem.tsx   | 18 +++++-------------
 1 file changed, 5 insertions(+), 13 deletions(-)

diff --git a/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsUpsellMenuItem.tsx b/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsUpsellMenuItem.tsx
index f9d9f88f11..6a877cb7a0 100644
--- a/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsUpsellMenuItem.tsx
+++ b/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsUpsellMenuItem.tsx
@@ -1,4 +1,4 @@
-import { Box, Flex, Icon, MenuItem, Text, Tooltip } from '@invoke-ai/ui-library';
+import { Flex, Icon, MenuItem, Text, Tooltip } from '@invoke-ai/ui-library';
 import { useTranslation } from 'react-i18next';
 import type { IconType } from 'react-icons';
 import { PiArrowUpBold } from 'react-icons/pi';
@@ -7,19 +7,11 @@ export const SettingsUpsellMenuItem = ({ menuText, menuIcon }: { menuText: strin
   const { t } = useTranslation();
 
   return (
-    <Tooltip label={t('upsell.professionalUpsell')} placement="right" zIndex={2}>
+    <Tooltip label={t('upsell.professionalUpsell')} placement="right" gutter={16}>
       <MenuItem as="a" href="http://invoke.com/pricing" target="_blank" icon={menuIcon({})}>
-        <Flex gap="1" alignItems="center">
-          <Text pb="2px">{menuText}</Text>
-          <Box>
-            <Icon
-              as={PiArrowUpBold}
-              sx={{
-                mt: '2px',
-                fill: 'invokeYellow.500',
-              }}
-            />
-          </Box>
+        <Flex gap="1" alignItems="center" justifyContent="space-between">
+          <Text>{menuText}</Text>
+          <Icon as={PiArrowUpBold} color="invokeYellow.500" />
         </Flex>
       </MenuItem>
     </Tooltip>