From 194e42a0267cf5eda89d9f9fd17ad2379676aa7e Mon Sep 17 00:00:00 2001
From: Poker Design Developer <developer@poker-design.local>
Date: Thu, 4 Jun 2026 21:56:56 +0800
Subject: [PATCH] fix: joker symmetry images positioned in top/bottom halves
 separately

---
 frontend/src/utils/cardRenderer.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/src/utils/cardRenderer.js b/frontend/src/utils/cardRenderer.js
index ecd611d..3445fe7 100644
--- a/frontend/src/utils/cardRenderer.js
+++ b/frontend/src/utils/cardRenderer.js
@@ -300,15 +300,16 @@ async function drawJokerBody(ctx, w, h, which, design, project) {
     ctx.drawImage(img, topX, topY, finalW, finalH)
     // symmetry_mode: 'flip' 垂直翻转，'rotate' 180° 旋转
     const symMode = design.symmetry_mode || 'flip'
+    const botY = padTop + offsetY + halfH + (halfH - finalH) / 2
     if (symMode === 'rotate') {
       ctx.save()
-      ctx.translate(topX + finalW, topY + finalH)
+      ctx.translate(topX + finalW, botY + finalH)
       ctx.rotate(Math.PI)
       ctx.drawImage(img, 0, 0, finalW, finalH)
       ctx.restore()
     } else {
       ctx.save()
-      ctx.translate(topX, topY + finalH)
+      ctx.translate(topX, botY + finalH)
       ctx.scale(1, -1)
       ctx.drawImage(img, 0, 0, finalW, finalH)
       ctx.restore()