UI improvements for multisplit inquiry workflow

This commit is contained in:
MichalC
2026-07-05 23:08:06 +02:00
parent 00533ffb1f
commit ebe048c13c
3 changed files with 360 additions and 32 deletions
+50 -32
View File
@@ -146,43 +146,61 @@ export function ProductCard({ product }: ProductCardProps) {
{/* Cena + CTA */}
<div className="mt-auto pt-2 flex items-end justify-between gap-2">
{product.price !== null ? (
<div>
<p className="text-lg font-bold text-primary font-heading leading-none">
{product.price.toLocaleString('pl-PL')} zł
</p>
<p className="text-xs text-text-muted mt-0.5">brutto</p>
</div>
) : (
<div className="flex items-center gap-1 text-accent">
<Phone className="size-3.5" />
<span className="text-sm font-semibold">Zapytaj o cenę</span>
</div>
)}
{product.price !== null ? (
added ? (
{product.category === 'multisplit' ? (
// Multisplit — zawsze formularz zapytania
<>
<div className="flex items-center gap-1 text-accent">
<Phone className="size-4" />
<span className="text-sm font-semibold">Wycena indywidualna</span>
</div>
<Link
href="/koszyk"
className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-green-500 text-white hover:bg-green-600 transition-colors shrink-0"
href={`/zapytanie-multisplit/${product.slug}`}
onClick={e => e.stopPropagation()}
>
<ShoppingCart className="size-3.5" /> Zobacz koszyk
<button className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-accent text-white hover:bg-accent/90 transition-colors shrink-0">
Zapytaj o wycenę
</button>
</Link>
) : (
<button
onClick={handleAddToCart}
className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-accent text-white hover:bg-accent/90 transition-colors shrink-0"
>
<ShoppingCart className="size-3.5" /> Do koszyka
</button>
)
</>
) : product.price !== null ? (
// Split z ceną — koszyk
<>
<div>
<p className="text-lg font-bold text-primary font-heading leading-none">
{product.price.toLocaleString('pl-PL')} zł
</p>
<p className="text-xs text-text-muted mt-0.5">brutto</p>
</div>
{added ? (
<Link
href="/koszyk"
className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-green-500 text-white hover:bg-green-600 transition-colors shrink-0"
onClick={e => e.stopPropagation()}
>
<ShoppingCart className="size-3.5" /> Zobacz koszyk
</Link>
) : (
<button
onClick={handleAddToCart}
className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-accent text-white hover:bg-accent/90 transition-colors shrink-0"
>
<ShoppingCart className="size-3.5" /> Do koszyka
</button>
)}
</>
) : (
<Link href="/kontakt">
<button className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-primary text-white hover:bg-primary/90 transition-colors shrink-0">
Zapytaj
</button>
</Link>
// Split bez ceny — zapytaj
<>
<div className="flex items-center gap-1 text-accent">
<Phone className="size-3.5" />
<span className="text-sm font-semibold">Zapytaj o cenę</span>
</div>
<Link href="/kontakt" onClick={e => e.stopPropagation()}>
<button className="flex items-center gap-1.5 px-3 py-2 rounded-lg text-xs font-bold bg-primary text-white hover:bg-primary/90 transition-colors shrink-0">
Zapytaj
</button>
</Link>
</>
)}
</div>
</div>