From 236f2938797d49969449732f37ec14696e34e6bf Mon Sep 17 00:00:00 2001
From: Adrian Bonpin <adrianbonpin@gmail.com>
Date: Fri, 26 Jun 2026 21:54:53 +0800
Subject: [PATCH] refactor: redesign landing page card hover behavior

- Remove card-level scale-up animation (whileHover/whileTap)
- Image now scales down slightly on hover instead of scaling up
- Keeps border/background color transitions for hover feedback
---
 app/page.tsx | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index 8079bec..b8671ed 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -129,8 +129,6 @@ function GameSection({
                         whileInView={{ opacity: 1, y: 0 }}
                         viewport={{ once: true }}
                         transition={{ duration: 0.3, delay: idx * 0.05 }}
-                        whileHover={{ scale: 1.03 }}
-                        whileTap={{ scale: 0.98 }}
                         className='group shrink-0 w-36 sm:w-44 rounded-xl bg-text/3 border border-border hover:border-text/30 hover:bg-text/6 transition-colors cursor-pointer overflow-hidden'
                         onClick={() => router.push(`/game/${game.id}?sync=1`)}
                     >
@@ -140,7 +138,7 @@ function GameSection({
                                     src={game.capsule_image}
                                     alt={game.title}
                                     fill
-                                    className='object-cover group-hover:scale-105 transition-transform duration-300'
+                                    className='object-cover group-hover:scale-[0.97] transition-transform duration-300'
                                     sizes='(max-width: 640px) 144px, 176px'
                                 />
                             ) : (
@@ -243,8 +241,6 @@ function SaleSection({
                             whileInView={{ opacity: 1, y: 0 }}
                             viewport={{ once: true }}
                             transition={{ duration: 0.3, delay: idx * 0.05 }}
-                            whileHover={{ scale: 1.03 }}
-                            whileTap={{ scale: 0.98 }}
                             className='group shrink-0 w-36 sm:w-44 rounded-xl bg-text/3 border border-border hover:border-text/30 hover:bg-text/6 transition-colors cursor-pointer overflow-hidden'
                             onClick={() => router.push(`/game/${game.id}?sync=1`)}
                         >
@@ -254,7 +250,7 @@ function SaleSection({
                                         src={game.capsule_image}
                                         alt={game.title}
                                         fill
-                                        className='object-cover group-hover:scale-105 transition-transform duration-300'
+                                        className='object-cover group-hover:scale-[0.97] transition-transform duration-300'
                                         sizes='(max-width: 640px) 144px, 176px'
                                     />
                                 ) : (