unchained/manoon-headless
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Center related products using flexbox instead of grid
Some checks failed
Build and Deploy / build (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Unchained
2026-03-22 11:00:44 +02:00
parent 97fc5f5f1d
commit 44d938953b
1 changed files with 5 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/product/ProductDetail.tsx
View File

@@ -414,17 +414,16 @@ export default function ProductDetail({ product, relatedProducts, locale = "SR"
{locale === "EN" ? "Similar Products" : "Slični proizvodi"} {locale === "EN" ? "Similar Products" : "Slični proizvodi"}
</h2> </h2>
</div> </div>
<div className="flex justify-center"> <div className="flex flex-wrap justify-center gap-6 lg:gap-8">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 lg:gap-8"> {relatedProducts.filter(p => p && p.id).slice(0, 4).map((relatedProduct, index) => (
{relatedProducts.filter(p => p && p.id).slice(0, 4).map((relatedProduct, index) => ( <div key={relatedProduct.id} className="w-full sm:w-[calc(50%-12px)] lg:w-[calc(25%-18px)]">
<ProductCard <ProductCard
key={relatedProduct.id}
product={relatedProduct} product={relatedProduct}
index={index} index={index}
locale={locale} locale={locale}
/> />
))} </div>
</div> ))}
</div> </div>
</div> </div>
</section> </section>