manohar/tia
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(hero): replace pulse ring with hover-only lift + rose glow on CTA

Browse source 
Remove continuous animate-cta-pulse ring — too distracting.
On hover: button lifts 0.5px, scales 1.03×, shadow grows with a
rose-200/60 tint. Fades back on mouse-out. Active state still
scales down to 0.95 for tactile press feel.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Manohar Gupta 2026-05-29 10:36:45 +05:30
parent 261a9cbbcb
commit e309c91309
1 changed files with 7 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/app/(marketing)/page.tsx
View file

@ -45,17 +45,13 @@ function Hero() {
one day look back on. one day look back on.
</p> </p>
{/* Pulse-ring wrapper — fades ring on hover */} <Link
<div className="relative inline-flex group"> href="/login"
<span className="absolute inset-0 rounded-full bg-rose-300 animate-cta-pulse group-hover:opacity-0 transition-opacity duration-300 pointer-events-none" /> className="inline-flex items-center gap-2.5 bg-white hover:bg-rose-50 border border-gray-200 hover:border-rose-300 text-gray-700 font-semibold px-7 py-3.5 rounded-full text-base transition-all duration-200 shadow-md hover:shadow-xl hover:shadow-rose-200/60 hover:-translate-y-0.5 hover:scale-[1.03] active:scale-95 active:translate-y-0"
<Link >
href="/login" <GoogleG />
className="relative inline-flex items-center gap-2.5 bg-white hover:bg-rose-50 border border-gray-200 hover:border-rose-300 text-gray-700 font-semibold px-7 py-3.5 rounded-full text-base transition-all duration-200 shadow-md hover:shadow-lg active:scale-95" Continue with Google
> </Link>
<GoogleG />
Continue with Google
</Link>
</div>
<p className="mt-4 text-xs text-gray-400">No credit card. No setup fee. Your data is yours.</p> <p className="mt-4 text-xs text-gray-400">No credit card. No setup fee. Your data is yours.</p>
</div> </div>