fix: plan item can not show all content if language is jp

This commit is contained in:
NFish 2025-01-07 12:23:17 +08:00
parent e46a3343b8
commit ab2e69faef

View File

@ -108,7 +108,7 @@ const SelfHostedPlanItem: FC<Props> = ({
window.location.href = contactSalesUrl window.location.href = contactSalesUrl
} }
return ( return (
<div className={cn(`relative flex flex-col w-[374px] min-h-[559px] border-[0.5px] rounded-2xl <div className={cn(`relative flex flex-col w-[374px] border-[0.5px] rounded-2xl
hover:shadow-lg hover:backdrop-blur-[5px] hover:border-effects-highlight overflow-hidden`, style[plan].bg)}> hover:shadow-lg hover:backdrop-blur-[5px] hover:border-effects-highlight overflow-hidden`, style[plan].bg)}>
<div> <div>
<div className={cn(isEnterprisePlan ? 'bg-price-enterprise-background absolute left-0 top-0 right-0 bottom-0 z-1' : '')} > <div className={cn(isEnterprisePlan ? 'bg-price-enterprise-background absolute left-0 top-0 right-0 bottom-0 z-1' : '')} >
@ -116,7 +116,7 @@ const SelfHostedPlanItem: FC<Props> = ({
{isEnterprisePlan && <div className='bg-[#09328c] opacity-15 mix-blend-plus-darker blur-[80px] size-[341px] rounded-full absolute -top-[104px] -left-[90px] z-15'></div>} {isEnterprisePlan && <div className='bg-[#09328c] opacity-15 mix-blend-plus-darker blur-[80px] size-[341px] rounded-full absolute -top-[104px] -left-[90px] z-15'></div>}
{isEnterprisePlan && <div className='bg-[#e2eafb] opacity-15 mix-blend-plus-darker blur-[80px] size-[341px] rounded-full absolute -right-[40px] -bottom-[72px] z-15'></div>} {isEnterprisePlan && <div className='bg-[#e2eafb] opacity-15 mix-blend-plus-darker blur-[80px] size-[341px] rounded-full absolute -right-[40px] -bottom-[72px] z-15'></div>}
</div> </div>
<div className='absolute top-0 left-0 right-0 bottom-0 p-6 z-10'> <div className='relative w-full p-6 z-10 min-h-[559px]'>
<div className=' flex flex-col gap-y-1 min-h-[108px]'> <div className=' flex flex-col gap-y-1 min-h-[108px]'>
{style[plan].icon} {style[plan].icon}
<div className='flex items-center'> <div className='flex items-center'>
@ -126,12 +126,11 @@ const SelfHostedPlanItem: FC<Props> = ({
</div> </div>
<div className='my-3'> <div className='my-3'>
<div className='flex items-end'> <div className='flex items-end'>
<div className={cn('leading-[125%] text-[28px] font-bold', style[plan].price)}>{t(`${i18nPrefix}.price`)}</div> <div className={cn('leading-[125%] text-[28px] font-bold shrink-0', style[plan].price)}>{t(`${i18nPrefix}.price`)}</div>
{!isFreePlan && <div className='ml-2 flex flex-col'> {!isFreePlan
<div className={cn('leading-normal text-[14px] font-normal', style[plan].priceTip)}> && <span className={cn('ml-2 py-1 leading-normal text-[14px] font-normal', style[plan].priceTip)}>
{t(`${i18nPrefix}.priceTip`)} {t(`${i18nPrefix}.priceTip`)}
</div> </span>}
</div>}
</div> </div>
</div> </div>
@ -142,12 +141,12 @@ const SelfHostedPlanItem: FC<Props> = ({
> >
{t(`${i18nPrefix}.btnText`)} {t(`${i18nPrefix}.btnText`)}
{isPremiumPlan {isPremiumPlan
&& <div className='flex items-center gap-x-1'> && <>
<div className='h-4 ml-0.5'> <div className='pt-[6px]'>
<AwsMarketplace /> <AwsMarketplace className='h-6' />
</div> </div>
<RiArrowRightUpLine className='size-4' /> <RiArrowRightUpLine className='size-4' />
</div>} </>}
</div> </div>
<div className={cn('mt-6 system-sm-semibold mb-2', style[plan].values)}>{t(`${i18nPrefix}.includesTitle`)}</div> <div className={cn('mt-6 system-sm-semibold mb-2', style[plan].values)}>{t(`${i18nPrefix}.includesTitle`)}</div>
<div className='flex flex-col gap-y-3'> <div className='flex flex-col gap-y-3'>