import React from "react"; import "./ProductDesign.scss"; import StarRating from "../starRating/StarRating"; import book from "../../assets/images/goldon.png"; import heart from "../../assets/icons/vuesax-linear-heart.svg"; import discountImg from "../../assets/icons/discount.png"; const ProductDesign = ({ colors, likeBtn, discount, discountPricePercent, discountPrice, productContent, star, productTags, priceDirection, productTitleAlignment, }) => { return (
{/* title holder */}

آیتم محصولات

نام این کامپوننت productDesign است و داخل این کامپوننت شما میتوانید با ture - false کردن Props ها به صورت داینامیک دیزاین های مختلفی را مشاهده کنید شما همچنین میتوانید با تغییر دادن مقدار PriceDirection به یکی از این ها: flex-row/flex-row-reverse/flex-column/flex-column-reverse دیزاین های متفاوتی را برای قسمت قسمت هر محصول ببینید.

برای نمایش ستاره ها من از یک کامپوننت استفاده کردم ==== Star Rating

{/* product items1 */}
{/* item1 */}
{/*star img holder*/}
{discountPricePercent && (

23%

)} {likeBtn && (
)} {discount && (
)} {/* img Holder */}
{/* select Color */} {colors && (
  • {/* */}
  • {/* */}
  • {/* */}
  • {/* */}
)}
{/* content holder */}

نسخه چاپی علموم تجربه هفتم

{productContent && (

این کتاب شامل گلدان و گیاه و خاک می باشد و همچنین آپشن های خوب دیگری نیز دارد.

)}
{/* star holder */} {star && (
39
)} {/* price holder */}
{/* price */}
قیمت {discountPrice && (

145تومان

)}

145.000تومان

{/* add to cart */}
{/* tag holder */} {productTags && (
)}
{/* product items2 */}
{/* item1 */}
{/*star img holder*/}
{discountPricePercent && (

23%

)} {likeBtn && (
)} {discount && (
)} {/* img Holder */}
{/* select Color */} {colors && (
  • {/* */}
  • {/* */}
  • {/* */}
  • {/* */}
)}
{/* content holder */}

نسخه چاپی علموم تجربه هفتم

{productContent && (

این کتاب شامل گلدان و گیاه و خاک می باشد و همچنین آپشن های خوب دیگری نیز دارد.

)}
{/* star holder */} {star && (
39
)} {/* price holder */}
{/* price */}
قیمت {discountPrice && (

145تومان

)}

145.000تومان

{/* add to cart */}
{/* tag holder */} {productTags && (
)}
{/* product items3 */}
{/* item1 */}
{/*star img holder*/}
{discountPricePercent && (

23%

)} {likeBtn && (
)} {discount && (
)} {/* img Holder */}
{/* select Color */} {colors && (
  • {/* */}
  • {/* */}
  • {/* */}
  • {/* */}
)}
{/* content holder */}

نسخه چاپی علموم تجربه هفتم

{productContent && (

این کتاب شامل گلدان و گیاه و خاک می باشد و همچنین آپشن های خوب دیگری نیز دارد.

)}
{/* star holder */} {star && (
39
)} {/* price holder */}
{/* price */}
قیمت {discountPrice && (

145تومان

)}

145.000تومان

{/* add to cart */}
{/* tag holder */} {productTags && (
)}
{/* product items4 */}
{/* item1 */}
{/*star img holder*/}
{discountPricePercent && (

23%

)} {likeBtn && (
)} {discount && (
)} {/* img Holder */}
{/* select Color */} {colors && (
  • {/* */}
  • {/* */}
  • {/* */}
  • {/* */}
)}
{/* content holder */}

نسخه چاپی علموم تجربه هفتم

{productContent && (

این کتاب شامل گلدان و گیاه و خاک می باشد و همچنین آپشن های خوب دیگری نیز دارد.

)}
{/* star holder */} {star && (
39
)} {/* price holder */}
{/* price */}
قیمت {discountPrice && (

145تومان

)}

145.000تومان

{/* add to cart */}
{/* tag holder */} {productTags && (
)}
{/* product items5 */}
{/* item1 */}
{/*star img holder*/}
{discountPricePercent && (

23%

)} {likeBtn && (
)} {discount && (
)} {/* img Holder */}
{/* select Color */} {colors && (
  • {/* */}
  • {/* */}
  • {/* */}
  • {/* */}
)}
{/* content holder */}

نسخه چاپی علموم تجربه هفتم

{productContent && (

این کتاب شامل گلدان و گیاه و خاک می باشد و همچنین آپشن های خوب دیگری نیز دارد.

)}
{/* star holder */} {star && (
39
)} {/* price holder */}
{/* price */}
قیمت {discountPrice && (

145تومان

)}

145.000تومان

{/* add to cart */}
{/* tag holder */} {productTags && (
)}
); }; export default ProductDesign; ProductDesign.defaultProps = { colors: true, likeBtn: true, discount: true, discountPricePercent: true, discountPrice: true, productContent: true, star: true, productTags: true, priceDirection: "flex-row", productTitleAlignment: "text-justify", };