From 931e2a3c1d228c2911e4f0ae349c2e5ae7c82c60 Mon Sep 17 00:00:00 2001
From: clawd <clawd@docker-openclaw.local>
Date: Wed, 18 Feb 2026 10:50:45 +0000
Subject: [PATCH] fix: heart button - bigger tap target, stopPropagation, scale
 animation on tap

---
 backend/data/recipes.db-shm                   | Bin 32768 -> 32768 bytes
 backend/data/recipes.db-wal                   | Bin 2410232 -> 2451432 bytes
 frontend/src/components/recipe/RecipeCard.tsx |   6 +++---
 frontend/src/pages/RecipePage.tsx             |   4 ++--
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/backend/data/recipes.db-shm b/backend/data/recipes.db-shm
index ebe12635618c270780ccf8eba2b470f29cb3269c..373dff35b4def2ab241f5ea1b6c62b16013831d1 100644
GIT binary patch
delta 226
zcmZo@U}|V!s+V}A%K!qxK+MR%AP~&NzyK0SN}G9Gc}{V;>Z%>ho);ERPgF0r5bt|k
zMyh&{*&qNi_dgPVh%#)f*X5k-z$7u*fmLAh8qRBGn^!p$@iKce1x()PaDDSPKNTis
zAErPs=Sv`v<I5BT=6niq5n}dY^54ACL78##0nWJ1yE05Tnf;i8fzod`-z!q$1pseg
BOe_EZ

delta 202
zcmZo@U}|V!s+V}A%K!p`K+MR%AmGWwzyK2YH6<_nZx-)M)m1y1JufVtE+4#mq2%^?
zXGv8LG8+Uy=Ke<l5K)GW^}3v!uW(*7oBV)NWAiG9BHqcH9Bys?=BL60W_$^RGCqa4
b2yNcvpu`ANn6!CUh6yK7{=?>bMM}H?PpM2f

diff --git a/backend/data/recipes.db-wal b/backend/data/recipes.db-wal
index 8dcab291fad6dc35913bcea00f147776b274ff44..6094a2e1b6d2995c3319fbcf9ffb1d361b0f7a6d 100644
GIT binary patch
delta 563
zcmb8rJ!lhQ9LMqJa@Tvm`=3b@YZC3X_mH$zYHRUjad8&nV8KNYDb>ju6*Pm|%HN7$
zks$ggI`~pB>L6O}qeMXj1v8i^Ee?YCLcpR8wkjTy!D~7=IQiRu!{_Udoe@5l&kDmR
zU<gH&unA>UP(=-OG|)r~Z3J|135GF(%^1ZPF2xpHhH*?_5|`r&Y(*E_upPa7)PK%~
z2U;9;-{8%3&++;*?xyH=k^jum`--Ub^|7{WEY35%^n;Xo9qXTa)qU-jrG$tX@(B29
z3O3lgtaIj=@mQbNU2UVfmA@RNRap!RlvnPAT|ru<i-cv<$u4nZ-8k#K3q@P=$;xdc
zSV&6~jb%HMQMPvuWd7weotE3P#V0pTot!P{aGvOpC-57-!&j)nJ9q;XcmYqjUW<%?
z(8V^Nh#ycN9v)2}r886fTN8DhWPQ(7>DWYVNQXMnpiJNw%m&vfD8oEAIeia;#;jZ-
zp;qBjj(PdaU-g99QPArbD?^)#3rwrQRM!8?RCZ5ZaX-qEnj&ji0PVF`2hM>8%IGA<
zB5Dgw*a5rHU`tw<bpKZgh-Q?Y(&gzL3ndK5v)deE+^R*6fZ(x5&2}q`%sBn(p~8dE
Ynjhn(#Q^Ht3xhik?!V++_a~|I2hIAr2mk;8

delta 83
zcmV~$w-tg=006-EF=D`g0tQgQK`pMe^0^5!(6WXjP<r?4zhQWP!b=bt8Jn1znTstf
et*j+Bws!VX2S=G);pFV%s#LkTd#E+-bLjq}^BeyF

diff --git a/frontend/src/components/recipe/RecipeCard.tsx b/frontend/src/components/recipe/RecipeCard.tsx
index 7d5fde3..cbf74e5 100644
--- a/frontend/src/components/recipe/RecipeCard.tsx
+++ b/frontend/src/components/recipe/RecipeCard.tsx
@@ -43,11 +43,11 @@ export function RecipeCard({ recipe }: { recipe: Recipe }) {
             </span>
           )}
           <button
-            onClick={(e) => { e.preventDefault(); favMutation.mutate() }}
-            className="ml-auto"
+            onClick={(e) => { e.preventDefault(); e.stopPropagation(); favMutation.mutate() }}
+            className="ml-auto p-2 -mr-2 min-w-[44px] min-h-[44px] flex items-center justify-center active:scale-125 transition-transform"
           >
             <Heart
-              size={20}
+              size={22}
               className={recipe.is_favorite ? 'fill-primary text-primary' : 'text-warm-grey'}
             />
           </button>
diff --git a/frontend/src/pages/RecipePage.tsx b/frontend/src/pages/RecipePage.tsx
index 74db2a1..a390887 100644
--- a/frontend/src/pages/RecipePage.tsx
+++ b/frontend/src/pages/RecipePage.tsx
@@ -126,8 +126,8 @@ export function RecipePage() {
           <Link to={`/recipe/${recipe.slug}/edit`} className="bg-surface/80 backdrop-blur-sm rounded-full p-2 min-w-[44px] min-h-[44px] flex items-center justify-center">
             <Pencil size={20} className="text-espresso" />
           </Link>
-          <button onClick={() => favMutation.mutate()} className="bg-surface/80 backdrop-blur-sm rounded-full p-2 min-w-[44px] min-h-[44px] flex items-center justify-center">
-            <Heart size={20} className={recipe.is_favorite ? 'fill-primary text-primary' : 'text-espresso'} />
+          <button onClick={() => favMutation.mutate()} className="bg-surface/80 backdrop-blur-sm rounded-full p-2 min-w-[44px] min-h-[44px] flex items-center justify-center active:scale-125 transition-transform">
+            <Heart size={22} className={recipe.is_favorite ? 'fill-primary text-primary' : 'text-espresso'} />
           </button>
         </div>
       </div>