fix: pause carousel on hidden tab, remove payment tile labels

Carousel: listen to visibilitychange to prevent animation backlog when
tab is backgrounded. Payment tiles: logo-only, no text labels.
This commit is contained in:
Usman Baig
2026-03-27 15:53:20 +01:00
parent 5faa0dec80
commit e206399f9d

View File

@@ -219,14 +219,13 @@ export default function PaymentForm({ plan, interval, limit, country, vatId }: P
key={method.id} key={method.id}
type="button" type="button"
onClick={() => { setSelectedMethod(method.id); setFormError(null) }} onClick={() => { setSelectedMethod(method.id); setFormError(null) }}
className={`flex flex-col items-center justify-center gap-1 rounded-xl border h-[52px] text-[10px] font-medium transition-all duration-200 ${ className={`flex items-center justify-center rounded-xl border h-[44px] transition-all duration-200 ${
isSelected isSelected
? 'border-brand-orange bg-brand-orange/5 text-white' ? 'border-brand-orange bg-brand-orange/5'
: 'border-neutral-700/50 bg-neutral-800/30 text-neutral-400 hover:border-neutral-600 hover:text-neutral-300' : 'border-neutral-700/50 bg-neutral-800/30 hover:border-neutral-600'
}`} }`}
> >
<MethodLogo type={method.id} /> <MethodLogo type={method.id} />
<span>{method.label}</span>
</button> </button>
) )
})} })}