From 0634dd65bb708fbf0833a4865b456ec87ee9b95a Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <rafizadanly@gmail.com>
Date: Wed, 16 Nov 2022 14:32:59 +0700
Subject: Fix product card layout

---
 src/components/ProductCard.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

(limited to 'src/components/ProductCard.js')

diff --git a/src/components/ProductCard.js b/src/components/ProductCard.js
index 77f902e0..23cc0665 100644
--- a/src/components/ProductCard.js
+++ b/src/components/ProductCard.js
@@ -10,8 +10,11 @@ export default function ProductCard({ data }) {
   let product = data;
   return (
     <div className="product-card">
-      <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="block">
+      <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="block relative">
         <LazyLoadImage effect="blur" src={product.image ? product.image : '/images/noimage.jpeg'} alt={product.name} className="product-card__image" />
+        {product.variant_total > 1 ? (
+          <div className="absolute bottom-2 left-2 badge-yellow">{product.variant_total} Varian</div>
+        ) : ''}
       </Link>
       <div className="product-card__description">
         <div>
@@ -24,7 +27,7 @@ export default function ProductCard({ data }) {
             {product.name}
           </Link>
         </div>
-        <div className="flex-1 mt-2">
+        <div className="mt-2">
           {product.lowest_price.discount_percentage > 0 ? (
             <div className="flex gap-x-1 items-center">
               <span className="badge-yellow">{product.lowest_price.discount_percentage}%</span>
@@ -41,7 +44,7 @@ export default function ProductCard({ data }) {
             </a>
           )}
           {product.stock_total > 0 ? (
-            <div className="badge-yellow bg-green-200 text-green-700 w-fit mt-2">Ready Stock</div>
+            <div className="badge-green mt-2">Ready Stock {product.stock_total > 5 ? '> 5' : '< 5'}</div>
           ) : ''}
         </div>
       </div>
-- 
cgit v1.2.3