Files
reui-blocks/blocks/faq16.tsx
T

99 lines
3.7 KiB
TypeScript

"use client";
import * as React from "react";
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion";
import { cn } from "@/lib/utils";
const FAQ_QUESTIONS = [
{
question: "این بخش چه کاربردی دارد؟",
answer:
"در این بخش پاسخ رایج‌ترین پرسش‌های کاربران درباره خدمات و امکانات سامانه ارائه شده است.",
},
{
question: "هدف این بخش چیست؟",
answer:
"هدف این بخش کاهش نیاز به تماس با پشتیبانی و دسترسی سریع کاربران به اطلاعات موردنیاز است.",
},
{
question: "چگونه پرسش‌های متداول را طراحی کنیم؟",
answer:
"پرسش‌های پرتکرار کاربران را جمع‌آوری کرده و پاسخ‌هایی کوتاه، دقیق و شفاف برای هرکدام آماده کنید.",
},
{
question: "مزیت وجود این بخش چیست؟",
answer:
"این بخش باعث افزایش رضایت کاربران، کاهش درخواست‌های پشتیبانی و دسترسی سریع‌تر به اطلاعات می‌شود.",
},
{
question: "این بخش چه کاربردی دارد؟",
answer:
"در این بخش پاسخ رایج‌ترین پرسش‌های کاربران درباره خدمات و امکانات سامانه ارائه شده است.",
},
{
question: "هدف این بخش چیست؟",
answer:
"هدف این بخش کاهش نیاز به تماس با پشتیبانی و دسترسی سریع کاربران به اطلاعات موردنیاز است.",
},
{
question: "چگونه پرسش‌های متداول را طراحی کنیم؟",
answer:
"پرسش‌های پرتکرار کاربران را جمع‌آوری کرده و پاسخ‌هایی کوتاه، دقیق و شفاف برای هرکدام آماده کنید.",
},
{
question: "مزیت وجود این بخش چیست؟",
answer:
"این بخش باعث افزایش رضایت کاربران، کاهش درخواست‌های پشتیبانی و دسترسی سریع‌تر به اطلاعات می‌شود.",
},
];
interface Faq16Props {
className?: string;
}
const Faq16 = ({ className }: Faq16Props) => {
return (
<section
dir="rtl"
lang="fa"
className={cn("bg-background py-32", className)}
>
<div className="container mx-auto max-w-3xl">
<h1 className="mb-10 text-center text-2xll font-bold tracking-tighter text-foreground">
پرسش‌های متداول
</h1>
<div className="z-20 mx-auto max-w-2xl rounded-2xl border border-border bg-background p-3">
<Accordion
type="single"
collapsible
className="flex w-full flex-col items-center justify-center gap-3 text-start"
>
{FAQ_QUESTIONS.map((item, index) => (
<AccordionItem
value={index.toString()}
key={index}
className="m-0 w-full rounded-xl bg-muted px-4 py-2"
>
<AccordionTrigger className="flex flex-1 justify-between text-start font-semibold transition-all hover:no-underline">
{item.question}
</AccordionTrigger>
<AccordionContent className="mt-2 text-muted-foreground">
{item.answer}
</AccordionContent>
</AccordionItem>
))}
</Accordion>
</div>
</div>
</section>
);
};
export { Faq16 };