fix(hero): replace pulse ring with hover-only lift + rose glow on CTA
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:
parent
261a9cbbcb
commit
e309c91309
1 changed files with 7 additions and 11 deletions
|
|
@ -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 */}
|
|
||||||
<div className="relative inline-flex group">
|
|
||||||
<span className="absolute inset-0 rounded-full bg-rose-300 animate-cta-pulse group-hover:opacity-0 transition-opacity duration-300 pointer-events-none" />
|
|
||||||
<Link
|
<Link
|
||||||
href="/login"
|
href="/login"
|
||||||
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"
|
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"
|
||||||
>
|
>
|
||||||
<GoogleG />
|
<GoogleG />
|
||||||
Continue with Google
|
Continue with Google
|
||||||
</Link>
|
</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>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue