From c54d147102efb346653f5f7e4f4ec9014b61a730 Mon Sep 17 00:00:00 2001
From: Vojtech Mares <iam@vojtechmares.com>
Date: Mon, 9 Jan 2023 18:58:14 +0100
Subject: [PATCH] feat(Pricing.tsx): add animation on hover on cards

---
 components/Pricing.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/Pricing.tsx b/components/Pricing.tsx
index 45c5df2..f91a7f9 100644
--- a/components/Pricing.tsx
+++ b/components/Pricing.tsx
@@ -43,7 +43,9 @@ function Plan({
     <section
       className={clsx(
         "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>