Product Description Version 1.0.0 Pushed

master
Pedram Keshavarzi 3 years ago
parent 5a8c845e5b
commit a3833a74a4
  1. 111
      src/components/ProductDescription/index.js

@ -0,0 +1,111 @@
import React from "react";
const ProductDescription = ({
navTitles,
items,
addToCart
}) =>{
return(
<>
<div className="flex w-full rounded bg-gray-200 justify-center mt-6 ">
<ul className="w-full flex justify-center">
{navTitles.map(item => <li key={`NavTitle_${item.id}`}
className={`p-6 mx-4 cursor-pointer
${item.isActive ? 'border-0 border-b-4 border-solid border-blue-500' : null}`
}
onClick={() => item.isActive ? null : item.isActive = !item.isActive }>
{item.title}</li>)}
</ul>
</div>
<div className="flex w-full ">
<div className="flex-1 ">
{items.map(e => (
e.items.map(item => (
<ul className="flex w-full flex-1 my-2 items-center">
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 text-blueC0" style={{minWidth: '300px'}}>{item.title}</li>
<li className="py-4 px-8 min-w-md bg-gray-200 ml-4 w-full">{item.description}</li>
</ul>
))
))}
</div>
<div className="my-2">
{addToCart}
</div>
</div>
</>
);
};
export default ProductDescription;
ProductDescription.defaultProps = {
navTitles: [
{
id: 0,
title: 'مشخصات',
isActive: true,
name: 'moshakhasat'
},
{
id: 1,
title: 'نقد و بررسی',
isActive: false
},
{
id: 2,
title: 'برسش و باسخ',
isActive:false
},
],
items: [
{
name: 'moshakhasat',
items: [
{
title : 'وزن کتاب',
description: '۱ کیلوگرم'
},
{
title : 'تعداد صفحات',
description: '400 صفحه'
},
{
title : 'نوع کاغذ',
description: 'گلاسه'
},
{
title : 'شماره شابک',
description: '1225548218000005818765'
},
{
title : 'انتشارات',
description: 'رزمندگان'
},
{
title : 'نویسنده و یا معلف',
description: 'یک نویسنده گمنام'
},
{
title : 'قطع',
description: 'خشتی'
},
{
title : 'سال انتشار',
description: '1399'
},
]
}
]
}
Loading…
Cancel
Save