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

fix(Pricing): on hover effect on tablet-like resolutions

Browse source
This commit is contained in:
Vojtěch Mareš 2023-01-12 13:01:15 +01:00
parent b61969e7d3
commit 074efcd7b1
Signed by: vojtech.mares
GPG key ID: C6827B976F17240D
1 changed files with 3 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

6
components/homepage/Pricing.tsx
View file

@ -42,13 +42,13 @@ function Plan({
return ( return (
<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 py-8",
featured ? "order-first bg-amber-500 py-8 lg:order-none" : "lg:py-8", featured ? "order-first bg-amber-500 lg:order-none" : "",
featured ? "hover:bg-amber-600" : "md:ring-1 md:hover:ring-slate-700 md:ring-transparent", featured ? "hover:bg-amber-600" : "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" "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 text-4xl text-white">{name}</h3>
<p className="font-display mt-4 text-lg font-light tracking-tight text-white"> <p className="font-display mt-4 text-lg font-light tracking-tight text-white">
{price} {price}
</p> </p>