fix(ui): upsell menuitem styling

This commit is contained in:
psychedelicious 2024-07-24 06:30:29 +10:00
parent 0279a27f66
commit a221ab2fb6

View File

@ -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>