1 files changed, 14 insertions, 3 deletions
diff --git a/src/components/ProductCard.js b/src/components/ProductCard.js
index 604ee9e0..b8967cc8 100644
--- a/src/components/ProductCard.js
+++ b/src/components/ProductCard.js
@@ -2,6 +2,7 @@ import Link from "./Link";
 import currencyFormat from "../helpers/currencyFormat";
 import { createSlug } from "../helpers/slug";
 import { LazyLoadImage } from "react-lazy-load-image-component";
+import { ChevronRightIcon } from "@heroicons/react/20/solid";
 
 import 'react-lazy-load-image-component/src/effects/blur.css';
 
@@ -34,17 +35,27 @@ export default function ProductCard({ data }) {
               <span className="badge-red">{product.lowest_price.discount_percentage}%</span>
             </div>
           ) : ''}
+          
           {product.lowest_price.price_discount > 0 ? (
             <p className="text-caption-1 text-gray_r-12 font-bold">
               {currencyFormat(product.lowest_price.price_discount)}
             </p>
           ) : (
-            <a href="https://wa.me" className="py-2 rounded block text-sm border border-yellow-900 text-center">
-              Tanya Harga
+            <a 
+              href="https://wa.me" 
+              target="_blank" 
+              rel="noreferrer" 
+              className="flex items-center gap-x-1 text-caption-1"
+            >
+              Tanya Harga <ChevronRightIcon className="text-yellow_r-11 w-5 h-5" />
             </a>
           )}
+          
           {product.stock_total > 0 ? (
-            <div className="badge-green mt-2">Ready Stock {product.stock_total > 5 ? '> 5' : '< 5'}</div>
+            <div className="flex gap-x-1 mt-2">
+              <div className="badge-green">Ready Stock</div>
+              <div className="badge-gray">{product.stock_total > 5 ? '> 5' : '< 5'}</div>
+            </div>
           ) : ''}
         </div>
       </div>