36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
import { defaultFaqs } from "../data/faq";
|
|
|
|
type FaqSectionProps = {
|
|
title?: string;
|
|
subtitle?: string;
|
|
limit?: number;
|
|
};
|
|
|
|
export function FaqSection({ title, subtitle, limit }: FaqSectionProps) {
|
|
const items = limit ? defaultFaqs.slice(0, limit) : defaultFaqs;
|
|
return (
|
|
<section className="mx-auto mt-10 max-w-6xl px-6">
|
|
<div className="rounded-3xl border border-border bg-background/80 backdrop-blur-sm p-6 shadow-sm">
|
|
<p className="text-xs font-semibold uppercase tracking-[0.2em] text-muted-foreground">FAQ</p>
|
|
<h2 className="mt-3 text-2xl font-semibold text-foreground">
|
|
{title ?? "Common questions, clear answers."}
|
|
</h2>
|
|
<p className="mt-2 text-sm text-muted-foreground">
|
|
{subtitle ??
|
|
"Find pricing, account, export, and security answers for LedgerOne."}
|
|
</p>
|
|
<ol className="mt-6 space-y-5 text-sm text-muted-foreground">
|
|
{items.map((item, index) => (
|
|
<li key={item.question} className="space-y-2">
|
|
<p className="text-xs font-semibold uppercase tracking-wide text-foreground">
|
|
{index + 1}. {item.question}
|
|
</p>
|
|
<p className="text-muted-foreground leading-relaxed">{item.answer}</p>
|
|
</li>
|
|
))}
|
|
</ol>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|