From 9131adc9635203dcb914e9874effb142247ba2a6 Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Mon, 27 Oct 2025 14:40:52 +0330
Subject: [PATCH] fix design bug product card

---
 src/app/product/components/AddComment.tsx |  4 ++--
 src/components/ProductCard.tsx            | 28 ++++++++++++-----------
 2 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/app/product/components/AddComment.tsx b/src/app/product/components/AddComment.tsx
index 989bace..6e4d642 100644
--- a/src/app/product/components/AddComment.tsx
+++ b/src/app/product/components/AddComment.tsx
@@ -32,7 +32,7 @@ const AddComment: FC<Props> = (props) => {
     const [disadvantages, setDisadvantages] = useState<string[]>([])
     const [currentAdvantage, setCurrentAdvantage] = useState<string>('')
     const [currentDisadvantage, setCurrentDisadvantage] = useState<string>('')
-    const [rating, setRating] = useState<number>(0)
+    const [rating, setRating] = useState<number>(5)
     const { mutate: addComment, isPending } = useAddComment()
 
     const validationSchema = yup.object({
@@ -56,7 +56,7 @@ const AddComment: FC<Props> = (props) => {
             advantage: [],
             disAdvantage: [],
             content: '',
-            rate: 0,
+            rate: 5,
             productId: productId
         }
     })
diff --git a/src/components/ProductCard.tsx b/src/components/ProductCard.tsx
index 2c119cd..ee967be 100644
--- a/src/components/ProductCard.tsx
+++ b/src/components/ProductCard.tsx
@@ -40,7 +40,7 @@ const ProductCard: FC<Props> = ({ item }) => {
 
     if (item) return (
         <Link href={`/product/${item._id}`} className='bg-white block rounded-[20px] sm:rounded-[40px] p-4 sm:p-6 w-full max-w-[240px] sm:max-w-[280px] mx-auto shadow'>
-            <div className='flex justify-center'>
+            <div className='flex justify-center h-[120px]'>
                 <Image
                     src={item.imagesUrl.cover}
                     width={170}
@@ -54,12 +54,12 @@ const ProductCard: FC<Props> = ({ item }) => {
                 {item.title_fa}
             </h4>
 
-            <div className='flex items-center justify-between mt-4 sm:mt-5'>
+            <div className='flex items-center justify-between mt-4 sm:mt-5 h-[32px] sm:h-[36px]'>
                 <div className='flex flex-col gap-1'>
                     <div className='text-xs sm:text-sm font-bold'>
                         {item?.default_variant?.price?.selling_price && item.default_variant.price.selling_price > 0
                             ? `${NumberFormat(item.default_variant.price.selling_price)} تومان`
-                            : 'بدون قیمت'
+                            : '۰ تومان'
                         }
                     </div>
                     {((item?.default_variant?.price?.discount_percent > 0 && item.default_variant.price.selling_price > 0) ||
@@ -69,15 +69,17 @@ const ProductCard: FC<Props> = ({ item }) => {
                             </div>
                         )}
                 </div>
-                {((item?.default_variant?.price?.discount_percent > 0 && item.default_variant.price.selling_price > 0) ||
-                    (item?.default_variant?.price?.is_specialSale && item.default_variant.price.selling_price > 0)) && (
-                        <div className='bg-red-500 text-white text-xs px-2 py-1 rounded-full'>
-                            {item.default_variant.price.discount_percent > 0
-                                ? `${item.default_variant.price.discount_percent}%`
-                                : 'فروش ویژه'
-                            }
-                        </div>
-                    )}
+                <div className='w-[60px] flex justify-end'>
+                    {((item?.default_variant?.price?.discount_percent > 0 && item.default_variant.price.selling_price > 0) ||
+                        (item?.default_variant?.price?.is_specialSale && item.default_variant.price.selling_price > 0)) && (
+                            <div className='bg-red-500 text-white text-xs px-2 py-1 rounded-full'>
+                                {item.default_variant.price.discount_percent > 0
+                                    ? `${item.default_variant.price.discount_percent}%`
+                                    : 'فروش ویژه'
+                                }
+                            </div>
+                        )}
+                </div>
             </div>
 
             <div className='flex justify-end mt-3'>
@@ -87,7 +89,7 @@ const ProductCard: FC<Props> = ({ item }) => {
     )
     return (
         <div className='bg-white rounded-[20px] sm:rounded-[40px] p-4 sm:p-6 w-full max-w-[240px] sm:max-w-[280px] mx-auto shadow'>
-            <div className='flex justify-center'>
+            <div className='flex justify-center h-[120px]'>
                 <Image
                     src={`https://dkstatics-public.digikala.com/digikala-products/40026b18c2b053ac4a68c3288556dc899a77aecd_1727277566.jpg?x-oss-process=image/resize,m_lfit,h_300,w_300/format,webp/quality,q_80`}
                     width={170}