leadstocompany/rudarksh-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: resolve related item scrolling issue in related products

Browse Source
This commit is contained in:
Tariq Jamal A
2025-05-19 01:53:36 +05:30
parent 4057552f59
commit df121cc783
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/products/RelatedProductCards.jsx
View File

@@ -30,12 +30,12 @@ const RelatedProductCards = ({ productId }) => {
You may also like
</h1>
</div>
<div className="overflow-x-auto hide-navbar gap-5 flex items-center justify-center">
<div className="overflow-x-auto hide-navbar flex items-center justify-start px-4 pb-4 -mx-4 snap-x">
{relatedProducts.map((product) => (
<Link href={`/products/${product.id}`} key={product.id}>
<div
key={product.id}
className="relative bg-[#EDE8E0] overflow-hidden sm:h-[350px] sm:w-[300px] "
className="relative bg-[#EDE8E0] overflow-hidden sm:h-[350px] sm:w-[300px] flex-shrink-0 mx-3 snap-center"
>
<div className="absolute top-0 left-0 bg-[#C19A5B] text-white py-1 px-3 rounded-br-lg z-10">
Exclusive
@@ -49,7 +49,7 @@ const RelatedProductCards = ({ productId }) => {
className="w-full h-full object-cover hover:scale-125 transition-transform ease-in-out duration-300"
/>
</div>
<div className="p-4 ">
<div className="p-4">
<h3 className="text-center text-[1rem] uppercase text-gray-800">
{product.product_name}
</h3>