Initial react editor website template

2026-08-29 14:03:50 -04:00
commit 3e072967e6
61 changed files with 7041 additions and 0 deletions
@@ -0,0 +1,28 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
+
+export type FaqProps = {
+  heading?: string;
+  description?: string;
+  items?: Array<{ question: string; answer: string }>;
+};
+
+export default function Faq({ heading = '', description = '', items = [] }: FaqProps) {
+  return (
+    <section id="faq" className="scroll-mt-20 bg-background py-20 sm:py-28">
+      <div className="section-shell">
+        <div className="max-w-4xl">
+          <h2 className="text-4xl font-normal leading-[0.98] tracking-[-0.04em] sm:text-5xl lg:text-6xl">{heading}</h2>
+          {description && <p className="mt-4 max-w-2xl leading-7 text-muted-foreground">{description}</p>}
+        </div>
+        <Accordion type="single" collapsible className="mt-12 border-t">
+          {items.map((item, index) => (
+            <AccordionItem key={index} value={`faq-${index}`}>
+              <AccordionTrigger className="py-7 text-2xl font-normal sm:py-8 sm:text-3xl">{item.question}</AccordionTrigger>
+              <AccordionContent className="max-w-3xl pb-8 text-base leading-7 text-muted-foreground">{item.answer}</AccordionContent>
+            </AccordionItem>
+          ))}
+        </Accordion>
+      </div>
+    </section>
+  );
+}