28 lines
1.2 KiB
TypeScript
28 lines
1.2 KiB
TypeScript
type QA = { q: string; a: string };
|
|
|
|
export default function FAQ({ items }: { items: QA[] }) {
|
|
return (
|
|
<section className="relative py-24 bg-gradient-to-b from-neutral-50 via-white to-neutral-100 dark:from-neutral-950 dark:via-neutral-900 dark:to-neutral-950">
|
|
<div className="container mx-auto max-w-4xl px-4">
|
|
<h2 className="text-3xl font-bold tracking-tight bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent text-center">
|
|
Frequently Asked Questions
|
|
</h2>
|
|
<div className="mt-10 space-y-4">
|
|
{items.map((x, i) => (
|
|
<details
|
|
key={i}
|
|
className="group rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/70 dark:bg-neutral-900/70 p-5 shadow-sm hover:shadow-md transition"
|
|
>
|
|
<summary className="cursor-pointer text-lg font-medium text-neutral-900 dark:text-white flex items-center justify-between">
|
|
{x.q}
|
|
<span className="transition-transform group-open:rotate-180">⌄</span>
|
|
</summary>
|
|
<p className="mt-3 text-sm text-neutral-700 dark:text-neutral-300">{x.a}</p>
|
|
</details>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|