AIvoices/frontend-nextjs/app/components/Order/Specs.tsx
2025-04-20 21:05:55 +01:00

42 lines
1.6 KiB
TypeScript

import { Check } from "lucide-react";
const Specs = ({ includedItems, technicalSpecs }: { includedItems: string[], technicalSpecs: string[] }) => {
const CheckIcon = <Check className="h-5 w-5 text-primary flex-shrink-0" />;
return (
<div className="mb-16">
<h2 className="text-4xl font-semibold mb-8 text-center">
Product Details
</h2>
<div className="grid md:grid-cols-2 gap-8">
<div>
<h3 className="text-xl font-semibold mb-4">
What&apos;s Included:
</h3>
<ul className="space-y-2">
{includedItems.map((item, index) => (
<li className="flex items-center gap-2" key={index}>
{CheckIcon}
<span>{item}</span>
</li>
))}
</ul>
</div>
<div>
<h3 className="text-xl font-semibold mb-4">
Technical Specs:
</h3>
<ul className="space-y-2">
{technicalSpecs.map((spec, index) => (
<li className="flex items-center gap-2" key={index}>
{CheckIcon}
<span>{spec}</span>
</li>
))}
</ul>
</div>
</div>
</div>
);
};
export default Specs;