changes

components/shop/ProductCard.tsx

@@ -6,6 +6,8 @@ import { ShoppingCart, GitCompare, Phone } from 'lucide-react';
 import { Product } from '@/content/products';
 import { useCartStore } from '@/lib/cart-store';
 import { useCompareStore } from '@/lib/compare-store';
+import { formatCurrency } from "@/lib/utils";
+import { Button, buttonClasses } from "@/components/ui/Button";
 import { useState } from 'react';
 
 const brandLogos: Record<string, string> = {
@@ -144,11 +146,10 @@ export function ProductCard({ product }: ProductCardProps) {
               <div />
               <Link
                 href={`/zapytanie-multisplit/${product.slug}`}
+                className={buttonClasses({ variant: 'primary', size: 'sm', className: 'shrink-0' })}
                 onClick={e => e.stopPropagation()}
               >
-                <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>
+                Zapytaj o wycenę
               </Link>
             </>
           ) : product.price !== null ? (
@@ -162,18 +163,20 @@ export function ProductCard({ product }: ProductCardProps) {
               {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"
+                  className={buttonClasses({ variant: 'success', size: 'sm', className: 'shrink-0' })}
                   onClick={e => e.stopPropagation()}
                 >
                   <ShoppingCart className="size-3.5" /> Zobacz koszyk
                 </Link>
               ) : (
-                <button
+                <Button
+                  variant="primary"
+                  size="sm"
+                  className="shrink-0"
                   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>
+                </Button>
               )}
             </>
           ) : (
@@ -182,10 +185,12 @@ export function ProductCard({ product }: ProductCardProps) {
                 <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 
+                href="/kontakt" 
+                className={buttonClasses({ variant: 'primary', size: 'sm', className: 'shrink-0' })}
+                onClick={e => e.stopPropagation()}
+              >
+                Zapytaj
               </Link>
             </>
           )}