Fix product images on mobile: use explicit width/height instead of fill

2026-03-22 21:27:38 +02:00
parent e9b95c44b9
commit 7ecd9c2e22
2 changed files with 7 additions and 6 deletions
--- a/src/components/product/ProductCard.tsx
+++ b/src/components/product/ProductCard.tsx
@@ -33,8 +33,9 @@ export default function ProductCard({ product, index = 0, locale = "SR" }: Produ
              src={image}
              alt={localized.name}
              fill
-              className="object-cover transition-transform duration-700 ease-out group-hover:scale-105"
-              sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 25vw"
+              className="object-cover object-center transition-transform duration-700 ease-out group-hover:scale-105"
+              sizes="100vw"
+              loading="lazy"
            />
          ) : (
            <div className="absolute inset-0 flex items-center justify-center text-[#999999]">