Files
spestexnika/components/pageParts/faq.tsx
Davron Chetin cdc6633091 maps
2025-10-08 15:11:25 +05:00

104 lines
2.8 KiB
TypeScript

import type { CollapseProps } from "antd";
import { Collapse } from "antd";
import Text from "../text";
import Title from "../title";
const FaqTexts: CollapseProps["items"] = [
{
key: "1",
showArrow: false,
className: "!border-[3px] !border-secondary !rounded-[15px] p-5 mb-10",
label: (
<div className="text-black text-2xl font-[600]">
<Text txt="faq1" />
</div>
),
children: (
<div className="pl-5 text-gray-500 text-[16px]">
<Text txt="faq-answer-1" />
</div>
),
},
{
key: "2",
showArrow: false,
className: "!border-[3px] !border-secondary !rounded-[15px] p-5 mb-10",
label: (
<div className="text-black text-2xl font-[600]">
<Text txt="faq2" />
</div>
),
children: (
<div className="pl-5 text-gray-500 text-[16px]">
<Text txt="faq-answer-2" />
</div>
),
},
{
key: "3",
showArrow: false,
className: "!border-[3px] !border-secondary !rounded-[15px] p-5 mb-10",
label: (
<div className="text-black text-2xl font-[600]">
<Text txt="faq3" />
</div>
),
children: (
<div className="pl-5 text-gray-500 text-[16px]">
<p className="mb-3">
<Text txt="faq-answer-3" />
</p>
<ul className="pl-4 flex flex-col gap-2">
<li className="flex items-center justify-end gap-3">
<Text txt="faq-answer-3-1" />
<span className="w-[8px] h-[8px] bg-gray-500 rounded-[50%]"></span>
</li>
<li className="flex items-center justify-end gap-3">
<Text txt="faq-answer-3-2" />
<span className="w-[8px] h-[8px] bg-gray-500 rounded-[50%]"></span>
</li>
<li className="flex items-center justify-end gap-3">
<Text txt="faq-answer-3-3" />
<span className="w-[8px] h-[8px] bg-gray-500 rounded-[50%]"></span>
</li>
</ul>
</div>
),
},
{
key: "4",
showArrow: false,
className: "!border-[3px] !border-secondary !rounded-[15px] p-5 mb-5",
label: (
<div className="text-black text-2xl font-[600]">
<Text txt="faq4" />
</div>
),
children: (
<div className="pl-5 text-gray-500 text-[16px]">
<Text txt="faq-answer-4" />
</div>
),
},
];
export default function Faq() {
return (
<div className="max-w-[1200px] w-full mx-auto text-left mb-30">
<div className="mb-10">
<Title text="faq-h2" />
</div>
<div>
<Collapse
ghost
accordion
className="border-[3px] border-b-[3px] bg-white border-secondary rounded-[50px] mb-5"
items={FaqTexts}
bordered={false}
defaultActiveKey={["1"]}
/>
</div>
</div>
);
}