Initial commit: UP Parivaar Dallas site
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
|
||||
export default function Faq({ items }: { items: { q: string; a: string }[] }) {
|
||||
const [open, setOpen] = useState(0);
|
||||
return (
|
||||
<div className="faq">
|
||||
{items.map((it, i) => {
|
||||
const isOpen = open === i;
|
||||
return (
|
||||
<div key={it.q} className={`faq__item ${isOpen ? "faq__item--open" : ""}`}>
|
||||
<button
|
||||
onClick={() => setOpen(isOpen ? -1 : i)}
|
||||
className="faq__trigger"
|
||||
>
|
||||
<span className="faq__question">{it.q}</span>
|
||||
<span className="faq__icon">{isOpen ? "✕" : "+"}</span>
|
||||
</button>
|
||||
<div className={`faq__panel ${isOpen ? "faq__panel--open" : ""}`}>
|
||||
<div className="faq__panel-inner">
|
||||
<p className="faq__answer">{it.a}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user