vojtech.mares/backup-websites-2024-01
Archived
1
0
Fork 0
Code Activity

feat(Pricing.tsx): add animation on hover on cards

Browse source
This commit is contained in:
Vojtěch Mareš 2023-01-09 18:58:14 +01:00
parent be1825357a
commit c54d147102
Signed by: vojtech.mares
GPG key ID: C6827B976F17240D
1 changed files with 3 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

4
components/Pricing.tsx
View file

@ -43,7 +43,9 @@ function Plan({
<section <section
className={clsx( className={clsx(
"flex flex-col rounded-3xl px-6 sm:px-8", "flex flex-col rounded-3xl px-6 sm:px-8",
featured ? "order-first bg-blue-600 py-8 lg:order-none" : "lg:py-8" featured ? "order-first bg-blue-600 py-8 lg:order-none" : "lg:py-8",
featured ? "hover:bg-blue-700" : "md:ring-1 md:hover:ring-slate-700 md:ring-transparent",
"transition ease-in-out duration-300 md:hover:-translate-y-1 md:hover:scale-110"
)} )}
> >
<h3 className="font-display mt-5 text-4xl text-white">{name}</h3> <h3 className="font-display mt-5 text-4xl text-white">{name}</h3>