49 lines
1.6 KiB
TypeScript
49 lines
1.6 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
import { FC } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Link } from "react-router-dom";
|
|
import { Container } from "@/components/layout";
|
|
import { aboutBron } from "@/data/about/about-bron";
|
|
import { useTranslate } from "@/hooks/use-translate";
|
|
import { useLangStore } from "@/store/lang";
|
|
|
|
interface Props {
|
|
className?: string;
|
|
}
|
|
|
|
export const AboutBron: FC<Props> = ({ className }) => {
|
|
const lang = useLangStore((state) => state.lang);
|
|
return (
|
|
<section
|
|
className={cn("md:py-20 py-10 relative overflow-hidden", className)}
|
|
>
|
|
<img
|
|
src="/CTA.png"
|
|
className="absolute top-0 left-0 size-full -z-10 object-cover"
|
|
/>
|
|
|
|
<Container>
|
|
<h3 className="h2 text-center !text-on_primary mb-6">
|
|
{aboutBron[useTranslate(lang)].title}
|
|
</h3>
|
|
<p className="text-center md:text-lg text-sm text-primary_03 max-w-[828px] px-5 mx-auto mb-10">
|
|
{aboutBron[useTranslate(lang)].p}
|
|
</p>
|
|
|
|
<div className="flex flex-col md:flex-row items-center gap-6">
|
|
<Link to={"/stend-form"} className="w-full">
|
|
<Button className="bg-reverse_primary w-full text-primary hover:bg-reverse_primary/90">
|
|
{aboutBron[useTranslate(lang)].button1}
|
|
</Button>
|
|
</Link>
|
|
<Link to={"/B2B-B2GS"} className="w-full">
|
|
<Button className="bg-reverse_primary w-full hover:bg-reverse_primary/90 text-primary">
|
|
{aboutBron[useTranslate(lang)].button2}
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
};
|