master
mahdi 3 years ago
parent b0378c6aef
commit 6fd33a9a62
  1. 47
      src/components/ProductStatusCard/index.js

@ -15,32 +15,37 @@ const ProductStatusCard = ({ items, productPrice, discountPrice }) => {
<section className="bg-white m-10 w-full sm:w-8/12 md:w-5/12 lg:w-3/12 p-5">
<div className="bg-gray-200 rounded px-4 py-2">
{items.map((item, index) => (
<div
className="flex flex-row items-center justify-between mb-4"
key={index}
>
<div className="flex flex-row items-center">
<img src={item.icon} alt="" className="w-10 h-10" />
<div className="flex flex-col mr-3">
<p className="text-sm">
<span className="font-bold">{item.subtitle}</span>
{item.title}
</p>
{item.customerSatisfaction && (
<p className="text-xs mt-1">
رضایت خریداران:
<span className="font-bold text-green-500 mr-2">
{item.customerSatisfactionPercent}
</span>
<div>
<div
className="flex flex-row items-center justify-between mt-3 mb-3"
key={index}
>
<div className="flex flex-row items-center">
<img src={item.icon} alt="" className="w-10 h-10" />
<div className="flex flex-col mr-3">
<p className="text-sm">
<span className="font-bold">{item.subtitle}</span>
{item.title}
</p>
)}
{item.customerSatisfaction && (
<p className="text-xs mt-1">
رضایت خریداران:
<span className="font-bold text-green-500 mr-2">
{item.customerSatisfactionPercent}
</span>
</p>
)}
</div>
</div>
{item.alertIcon && (
<img src={circle} alt="" className="w-8 h-8" />
)}
</div>
{item.alertIcon && <img src={circle} alt="" className="w-8 h-8" />}
<div className="border-b border-gray-300"></div>
</div>
))}
<div className="flex flex-col items-center">
<p className="text-2xl text-blue-600 my-3">
<p className="text-2xl text-blue-600 mt-5 mb-2">
{productPrice}
<span className="text-lg text-gray-700 font-light">تومان</span>
</p>
@ -51,7 +56,7 @@ const ProductStatusCard = ({ items, productPrice, discountPrice }) => {
</p>
</div>
<div className="w-full flex flex-col items-center">
<button className="w-11/12 mt-7 mb-4 rounded bg-blue-400 text-white px-5 py-4 text-lg hover:bg-blue-600 transtition ease-linear duration-300">
<button className="w-11/12 mt-5 mb-2 rounded bg-blue-400 text-white px-5 py-4 text-lg hover:bg-blue-600 transtition ease-linear duration-300">
افزودن به سبد خرید
</button>
</div>

Loading…
Cancel
Save