From 944233f19627966a8178eac66828e260e72309b9 Mon Sep 17 00:00:00 2001
From: Jandl-hostacny <jakub.hostacny@jandl.sk>
Date: Thu, 22 Oct 2026 15:15:56 +0200
Subject: [PATCH] feat: posuvnik zvislej polohy cenovky v produkte

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 src/components/editor/ProductEditor.tsx | 1 +
 src/lib/productCard.ts                  | 4 ++--
 src/types/newsletter.ts                 | 1 +
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/editor/ProductEditor.tsx b/src/components/editor/ProductEditor.tsx
index ac28269..94bd1b7 100644
--- a/src/components/editor/ProductEditor.tsx
+++ b/src/components/editor/ProductEditor.tsx
@@ -545,6 +545,7 @@ export const ProductEditor: React.FC<ProductEditorProps> = ({
 
             <Slider label="Veľkosť" value={badgeWidth} display={`${badgeWidth} px`} min={60} max={200} step={1} onChange={set('badgeWidth')} />
             <Slider label="Vodorovne" value={p.badgeOffsetX || 0} display={`${p.badgeOffsetX || 0}`} min={-150} max={8} step={1} onChange={set('badgeOffsetX')} />
+            <Slider label="Zvisle" value={p.badgeOffsetY || 0} display={`${p.badgeOffsetY || 0}`} min={-150} max={8} step={1} onChange={set('badgeOffsetY')} />
 
             {isLoyalty ? (
               <>
diff --git a/src/lib/productCard.ts b/src/lib/productCard.ts
index 262787a..3980dca 100644
--- a/src/lib/productCard.ts
+++ b/src/lib/productCard.ts
@@ -225,7 +225,7 @@ export function cardVisualKey(p: CardProduct, ctx: CardContext): string {
     'v2', // verzia vykreslenia – zvýšiť, keď sa zmení spôsob prípravy obrázkov (v2: písma z Adobe Fonts)
     ctx.variant, ctx.cardWidth, p.cardBgColor || ctx.cardBg, ctx.variant === 'standard' ? ctx.defaultBadge : null,
     p.imageUrl, p.imageScale ?? DEFAULT_IMAGE_SCALE, p.imageOffsetX || 0, p.imageOffsetY || 0,
-    p.customBadgePngUrl, badgeWidthFor(p, ctx.variant), p.badgeOffsetX || 0,
+    p.customBadgePngUrl, badgeWidthFor(p, ctx.variant), p.badgeOffsetX || 0, p.badgeOffsetY || 0,
     t ? [t.svgRaw, t.layersConfig, t.width] : null,
     p.priceMain, p.priceSub, p.discountText, p.badgeText, p.unitPrice,
     p.cardPriceMain, p.cardPriceSub, p.cardDiscount, p.cardUnitPrice, p.appPriceMain, p.appPriceSub, p.appDiscount, p.appUnitPrice,
@@ -355,7 +355,7 @@ function renderVisualPreview(p: CardProduct, ctx: CardContext, key: string): str
           })
           .join('')}
         ${(p.labels || []).map(renderLabel).join('')}
-        <div style="position: absolute; right: ${8 - (p.badgeOffsetX || 0)}px; bottom: 8px; width: ${bw}px;">
+        <div style="position: absolute; right: ${8 - (p.badgeOffsetX || 0)}px; bottom: ${8 - (p.badgeOffsetY || 0)}px; width: ${bw}px;">
             ${stores ? `<div style="position: absolute; right: ${insetRight - sx}px; bottom: calc(100% - ${insetTop}px + ${sy}px);">${stores}</div>` : ''}
             ${renderBadge(p, ctx, bw)}
         </div>
diff --git a/src/types/newsletter.ts b/src/types/newsletter.ts
index ac51303..3add029 100644
--- a/src/types/newsletter.ts
+++ b/src/types/newsletter.ts
@@ -39,6 +39,7 @@ export interface ProductItem {
   badgeCustomTemplate?: BadgeTemplate; // Uložená dynamická šablóna cenovky (bez fixnej ceny)
   badgeWidth?: number;   // Nastaviteľná šírka/veľkosť cenovky v px (napr. 70 až 180)
   badgeOffsetX?: number; // Posun celej cenovky (aj so štítkami predajní) vodorovne v px, + doprava
+  badgeOffsetY?: number; // Posun celej cenovky zvisle v px, + nadol
   badgeAlign?: 'left' | 'center' | 'right'; // Zarovnanie cenovky (vľavo, stred, vpravo)
   badgePaddingTop?: number;    // Odsadenie zhora v px
   badgePaddingBottom?: number; // Odsadenie zdola v px