From 2b918b6a4a3017343459c70a3f06303330708e32 Mon Sep 17 00:00:00 2001
From: mahdi <andalibmahdi45@gmail.com>
Date: Mon, 3 Jan 2022 15:21:30 +0330
Subject: [PATCH] update

---
 src/components/productDesign/ProductDesign.js | 36 ++++++++++---------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/src/components/productDesign/ProductDesign.js b/src/components/productDesign/ProductDesign.js
index e5be2a1..22bce13 100644
--- a/src/components/productDesign/ProductDesign.js
+++ b/src/components/productDesign/ProductDesign.js
@@ -83,23 +83,25 @@ const ProductDesign = ({
             className={`w-full sm:w-60 md:w-72 mx-1 rounded-lg shadow-sm p-2 my-3 ${productHolderBorder} ${productHolderBorderColor}`}
           >
             <div className="w-full relative">
-              {discountPricePercent && (
-                <div className="bg-discountPriceBg absolute left-2 top-4 rounded-md px-2 py-1">
-                  <p className="text-discountPriceTitle font-bold text-xs">
-                    23<span>%</span>
-                  </p>
-                </div>
-              )}
-              {likeBtn && (
-                <div className="bg-likeBtnBg absolute left-2 top-10 rounded-md p-1">
-                  <img src={heart} alt="" className="w-full" />
-                </div>
-              )}
-              {discount && (
-                <div className="absolute left-2 top-20 rounded-md">
-                  <img src={discountImg} alt="" className="w-full" />
-                </div>
-              )}
+              <div className="absolute left-2 top-2">
+                {discountPricePercent && (
+                  <div className="bg-discountPriceBg rounded-md px-2 py-2">
+                    <p className="text-discountPriceTitle font-bold text-xs">
+                      23<span>%</span>
+                    </p>
+                  </div>
+                )}
+                {likeBtn && (
+                  <div className="bg-likeBtnBg rounded-md py-1 flex justify-center">
+                    <img src={heart} alt="" className="w-5" />
+                  </div>
+                )}
+                {discount && (
+                  <div className="absolute rounded-md">
+                    <img src={discountImg} alt="" className="w-full" />
+                  </div>
+                )}
+              </div>
               {/* img Holder */}
               <div className="flex-shrink-0">
                 {verticalImg && (