mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
96 lines
1.8 KiB
TypeScript
96 lines
1.8 KiB
TypeScript
import { useTranslations } from 'next-intl'
|
|
import { Container } from './Container'
|
|
|
|
const faqs = [
|
|
[
|
|
{
|
|
question: 'faq.q1',
|
|
answer: 'faq.a2',
|
|
},
|
|
{
|
|
question: 'faq.q2',
|
|
answer: 'faq.a2',
|
|
},
|
|
{
|
|
question: 'faq.q3',
|
|
answer: 'faq.a3',
|
|
},
|
|
{
|
|
question: 'faq.q4',
|
|
answer: 'faq.a4',
|
|
},
|
|
],
|
|
[
|
|
{
|
|
question: 'faq.q5',
|
|
answer: 'faq.a5',
|
|
},
|
|
{
|
|
question: 'faq.q6',
|
|
answer: 'faq.a6',
|
|
},
|
|
{
|
|
question: 'faq.q7',
|
|
answer: "faq.a7",
|
|
},
|
|
],
|
|
[
|
|
{
|
|
question:
|
|
'faq.q8',
|
|
answer: 'faq.a8',
|
|
},
|
|
{
|
|
question: 'faq.q9',
|
|
answer: 'faq.a9',
|
|
},
|
|
{
|
|
question: 'faq.q10',
|
|
answer: 'faq.a10',
|
|
},
|
|
],
|
|
]
|
|
|
|
export function Faqs() {
|
|
const t = useTranslations('HomePage')
|
|
return (
|
|
<section
|
|
id="faqs"
|
|
aria-labelledby="faq-title"
|
|
className="relative overflow-hidden bg-black py-20 sm:py-32"
|
|
>
|
|
<Container className="relative">
|
|
<div className="mx-auto max-w-2xl lg:mx-0">
|
|
<h2
|
|
id="faq-title"
|
|
className="font-display text-3xl tracking-tight text-primary sm:text-4xl"
|
|
>
|
|
{t('faq.title')}
|
|
</h2>
|
|
<p className="mt-4 text-lg tracking-tight text-muted-foreground">
|
|
{t('faq.des')}
|
|
</p>
|
|
</div>
|
|
<ul className="mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-8 lg:max-w-none lg:grid-cols-3">
|
|
{faqs.map((column, columnIndex) => (
|
|
<li key={columnIndex}>
|
|
<ul className="flex flex-col gap-y-8">
|
|
{column.map((faq, faqIndex) => (
|
|
<li key={faqIndex}>
|
|
<h3 className="font-display text-lg leading-7 text-primary">
|
|
{t(faq.question)}
|
|
</h3>
|
|
<p className="mt-4 text-sm text-muted-foreground">
|
|
{t(faq.answer)}
|
|
</p>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</Container>
|
|
</section>
|
|
)
|
|
}
|