From a1d63ee6005987059471b0e78b053226a68a40c3 Mon Sep 17 00:00:00 2001
From: mahdi <andalibmahdi45@gmail.com>
Date: Sat, 28 May 2022 11:31:50 +0430
Subject: [PATCH] update src/components/SingleProduct/ProductDesign1/index.js
 and Picker.js

---
 .../SingleProduct/ProductDesign1/index.js       | 17 ++++++++++-------
 src/components/ThemeColor/util/Picker.js        |  5 +++--
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/SingleProduct/ProductDesign1/index.js b/src/components/SingleProduct/ProductDesign1/index.js
index 7819aff..3f19dc0 100644
--- a/src/components/SingleProduct/ProductDesign1/index.js
+++ b/src/components/SingleProduct/ProductDesign1/index.js
@@ -199,12 +199,15 @@ const Design1 = ({
           />
         )}
       </div>
-      {/* {hoverEffect && (      )} */}
-      <div className="absolute right-0 bottom-0 h-full w-full group-hover:bg-blackBg group-hover:rounded group-hover:border transition duration-300 opacity-50"></div>
-      <Button
-        className={`group-hover:opacity-100 bg-blueBgColor text-white rounded p-2 text-xs opacity-0 absolute left-1/2 bottom-1/2 transform -translate-x-1/2 -translate-y-1/2`}
-        text={"افزودن به سبد خرید"}
-      />
+      {hoverEffect && (
+        <>
+          <div className="absolute right-0 bottom-0 h-full w-full group-hover:bg-black group-hover:rounded group-hover:border transition duration-300 opacity-50"></div>
+          <Button
+            className={`group-hover:opacity-100 bg-blue-600 text-white rounded p-2 text-xs opacity-0 absolute left-1/2 bottom-1/2 transform -translate-x-1/2 -translate-y-1/2`}
+            text={"افزودن به سبد خرید"}
+          />
+        </>
+      )}
     </div>
   );
 };
@@ -248,7 +251,7 @@ Design1.defaultProps = {
 
   productTags: ["ارسال رایگان", "برچسب های دیگر", "دسته بندی به صورت کادو"],
 
-  hoverEffect: false,
+  hoverEffect: true,
 
   //میتونیم تعیین کنیم که قیمت و دکمه اضاف به سبد خرید کنار یکدیگر باشند یا زیر هم
   priceDirection: "flex-row",
diff --git a/src/components/ThemeColor/util/Picker.js b/src/components/ThemeColor/util/Picker.js
index 52bd3c6..21ff169 100644
--- a/src/components/ThemeColor/util/Picker.js
+++ b/src/components/ThemeColor/util/Picker.js
@@ -1,10 +1,11 @@
-import { SketchPicker } from "react-color";
 import { useState } from "react";
+import { SketchPicker } from "react-color";
+
 const Picker = ({ theme, item, setTheme }) => {
   const [color, setColor] = useState(theme[item]);
   return (
     <SketchPicker
-      className="absolute bottom-16 left-0"
+      className="absolute bottom-0 left-1/2"
       color={color}
       onChange={(updatedColor) => {
         setColor(updatedColor.hex);