You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

126 lines
3.2 KiB

import React, { useState } from "react";
const ProductDesign = ({
colors,
likeBtn,
discount,
discountPricePercent,
discountPrice,
productContent,
star,
productTags,
priceDirection,
productTitleAlignment,
priceHolder,
productHolderBorder,
productHolderBorderColor,
productTitleColor,
productExcerptTextColor,
productCat,
productCatTextColor,
rangeHolder,
verticalImg,
horizontalImg,
rangeWidth,
addToCartHolder,
productName,
productPrice,
productImg,
writeGHEIMAT,
numberOfRegards,
productHolderHoverBorder,
hoverMode,
teacher
}) => {
const [isHovering, setIsHovering] = useState(false);
return (
<div className={`flex flex-col pt-4 text-right rounded-xl justify-start w-full m-4 border border-red82OP`}
style={ {width: '400px', direction:'rtl'}}
>
<div className="border-b border-red82OP pb-2 px-4">
<h1 className="text-red52 text-lg font-bold">{productName}</h1>
<p className="text-red26 text-sm my-2">
در این قسمت یک توضیحات کوتاه در مورد دوره خواهد آمد که بصورت دو خط در این قسمت قرار میگیرد
</p>
</div>
<div className="flex border-b border-red82OP px-4 py-2">
<div>
<h1 className="font-bold text-red26">
استاد : {teacher}
</h1>
</div>
</div>
<div className="flex border-b border-red82OP px-4 py-2 text-red26">
<h1>نوع گروه : A</h1>
</div>
<div className="flex p-4 justify-between items-center">
<h1 className="font-black text-xl text-red52">{productPrice} تومان</h1>
<div
className={`bg-pinkF5 text-red26 w-32 border-2 border-red52 px-1 py-2 text-xs flex justify-center
`}
>
<button>افزودن به سبد خرید</button>
</div>
</div>
</div>
);
};
export default ProductDesign;
ProductDesign.defaultProps = {
// icons on product image
colors: false,
likeBtn: false,
discount: false,
discountPricePercent: false,
// product price
discountPrice: false,
priceHolder: true,
productContent: false,
star: true,
productTags: [],
productCat: true,
rangeHolder: true,
// دو مدل عکس طراحی کردم که یکی عرض بیشتری دارد یکی ارتفاع
verticalImg: true,
horizontalImg: false,
addToCartHolder: false,
productTitleColor: "text-productTitle",
productExcerptTextColor: "text-productContent",
productCatTextColor: "text-darkCrimsonTextColor",
// برای درصد دادن به عرض رنج
rangeWidth: "w-44",
//دی ای وی که محصول داخلش است میتونیم بهش بوردر بدیم
productHolderBorder: "border",
productHolderBorderColor: "border-grayBorderColor",
productTitleAlignment: "text-justify",
//میتونیم تعیین کنیم که قیمت و دکمه اضاف به سبد خرید کنار یکدیگر باشند یا زیر هم
priceDirection: "flex-row",
// productImg: book,
writeGHEIMAT: false
};