diff options
| author | Miqdad <ahmadmiqdad27@gmail.com> | 2025-10-23 11:53:50 +0700 |
|---|---|---|
| committer | Miqdad <ahmadmiqdad27@gmail.com> | 2025-10-23 11:53:50 +0700 |
| commit | 098e6386fd7f846786aa26bc5da4884e2ab3b26b (patch) | |
| tree | 48b2b25b4655de0c8fa68ab5eaa4fe137b6e2f41 /src/lib | |
| parent | bb953ad18e9040e009d93dff772b792ade6b11f2 (diff) | |
<MIqdad> fix varian and ready stock badge
Diffstat (limited to 'src/lib')
| -rw-r--r-- | src/lib/product/components/ProductCard.jsx | 53 |
1 files changed, 28 insertions, 25 deletions
diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 7c47a10d..a296eff3 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -92,24 +92,6 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { className='gambarA w-full object-contain object-center h-36 sm:h-48' /> - {/* PICK UP NOW badge (kanan-atas gambar) */} - {product?.isInBu && ( - <Link - href='/panduan-pick-up-service' - aria-label='Pick Up Now' - className='absolute top-1 right-1 z-30' - > - <Image - src='/images/PICKUP-NOW.png' - alt='Pick Up Now' - width={83} - height={24} - // className='drop-shadow-sm' - loading='eager' - /> - </Link> - )} - <div className='absolute top-0 right-0 flex mt-3 z-20'> <div className='gambarB '> {product?.isSni && ( @@ -138,15 +120,36 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { </div> </div> - {/* BADGE DISKON KIRI-ATAS (match mobile) */} + {/* BADGE DISKON Kanan-ATAS */} {(product?.lowestPrice?.discountPercentage ?? 0) > 0 && ( - <div className='absolute left-0 top-5 sm:top-5 z-30 translate-y-5 sm:translate-y-5'> - <div className='bg-red-600 text-white px-2 py-1 rounded-r-lg shadow-sm text-xs font-bold leading-none'> + <div className='absolute right-0 top-1.5 '> + <div className='bg-red-600 text-white px-2 py-1 rounded-l-lg shadow-sm text-xs font-bold leading-none'> {Math.floor(product.lowestPrice.discountPercentage)}% </div> </div> )} + {/* BOTTOM-LEFT: Varian + PICK UP NOW */} + {(product?.variantTotal > 1 || product?.isInBu) && ( + <div className='absolute bottom-1.5 left-1.5 z-30 flex items-center gap-2'> + {product?.variantTotal > 1 && ( + <div className='badge-gray'> + {product.variantTotal} Varian + </div> + )} + {product?.isInBu && ( + <Image + src='/images/PICKUP-NOW.png' + alt='Pick Up Now' + width={83} + height={24} + className='drop-shadow-sm' + loading='eager' + /> + )} + </div> + )} + {router.pathname != '/' && product?.flashSale?.id > 0 && ( <div className='absolute bottom-0 w-full grid'> <div className='absolute bottom-0 w-full h-full'> @@ -184,11 +187,11 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { </div> </div> )} - {product.variantTotal > 1 && ( + {/* {product.variantTotal > 1 && ( <div className='absolute badge-gray bottom-1.5 left-1.5'> {product.variantTotal} Varian </div> - )} + )} */} </Link> <div className='p-2 sm:p-3 pb-3 text-caption-2 sm:text-body-2 leading-5'> @@ -358,7 +361,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { </div> </div> - {/* BADGE DISKON KIRI-ATAS (tetap) */} + {/* BADGE DISKON Kanan-ATAS */} {(product?.lowestPrice?.discountPercentage ?? 0) > 0 && ( <div className='absolute right-0 top-1.5 '> <div className='bg-red-600 text-white px-2 py-1 rounded-l-lg shadow-sm text-xs font-bold leading-none'> @@ -369,7 +372,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { {/* BOTTOM-LEFT: Varian + PICK UP NOW */} {(product?.variantTotal > 1 || product?.isInBu) && ( - <div className='absolute bottom-0 left-0 z-30 flex items-center gap-2'> + <div className='absolute bottom-1.5 left-1.5 z-30 flex items-center gap-2'> {product?.variantTotal > 1 && ( <div className='badge-gray'> {product.variantTotal} Varian |