128 lines
6.0 KiB
TypeScript
128 lines
6.0 KiB
TypeScript
import { Swiper, Testimonial } from '@/components/pages/Home';
|
|
import { Button } from '@/components/ui/button';
|
|
import Layout from '@/layouts/client/layout';
|
|
import { about, artOfWeaving } from '@/routes';
|
|
import { useTranslations } from '@/utils/i18n';
|
|
import artofWeaving from '@asset/img/carpet/IMG_1301.jpg';
|
|
import kaleenCarpet from '@asset/img/carpet/IMG_3401.jpg';
|
|
import sooryaCarpet from '@asset/img/carpet/sci trad 31.jpg';
|
|
import { Head, Link } from '@inertiajs/react';
|
|
import { MoveRight } from 'lucide-react';
|
|
|
|
export default function Welcome({
|
|
data,
|
|
}: {
|
|
data: {
|
|
carousel: [{ image_url: string; alt: string }];
|
|
testimonial: [
|
|
{
|
|
name: string;
|
|
location: string;
|
|
image: string;
|
|
description: string;
|
|
},
|
|
];
|
|
};
|
|
}) {
|
|
const { t } = useTranslations();
|
|
return (
|
|
<>
|
|
<Head title="Premium Hand Knotted Carpets in Nepal">
|
|
<link rel="preconnect" href="https://fonts.bunny.net" />
|
|
<link
|
|
href="https://fonts.bunny.net/css?family=instrument-sans:400,500,600"
|
|
rel="stylesheet"
|
|
/>
|
|
<meta
|
|
name="description"
|
|
content="Experience the finest hand-knotted carpets in Nepal with Soorya Carpet. Each piece is crafted by skilled artisans to deliver unmatched quality, luxury, and timeless design."
|
|
/>
|
|
</Head>
|
|
<Layout>
|
|
<div>
|
|
<Swiper item={data?.carousel} />
|
|
<section className="mx-auto grid max-w-screen-2xl grid-cols-2 gap-20 px-16 py-12">
|
|
<img
|
|
src={sooryaCarpet}
|
|
alt="Soorya Carpet"
|
|
className="aspect-video rounded-lg object-cover object-center"
|
|
/>
|
|
<div className="flex flex-col gap-4">
|
|
<div className="flex flex-col gap-1">
|
|
<h2 className="font-serif text-3xl font-medium">
|
|
{t('pages.home.sections.first.title')}
|
|
</h2>
|
|
<p className="text-gray-500">
|
|
{t('pages.home.sections.first.desc')}
|
|
</p>
|
|
</div>
|
|
<Link href={about()}>
|
|
<Button
|
|
variant={'outline'}
|
|
className="w-fit cursor-pointer border border-primary bg-transparent font-serif ring-primary"
|
|
>
|
|
{t('pages.home.sections.first.button')}{' '}
|
|
<MoveRight />
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</section>
|
|
<section className="mx-auto grid max-w-screen-2xl grid-cols-2 gap-20 px-16 py-12">
|
|
<div className="flex flex-col gap-4">
|
|
<div className="flex flex-col gap-1">
|
|
<h3 className="font-serif text-3xl font-medium">
|
|
{t('pages.home.sections.second.title')}
|
|
</h3>
|
|
<p className="text-gray-500">
|
|
{t('pages.home.sections.second.desc')}
|
|
</p>
|
|
</div>
|
|
<Link href={about()}>
|
|
<Button
|
|
variant={'outline'}
|
|
className="w-fit cursor-pointer border border-primary bg-transparent font-serif ring-primary"
|
|
>
|
|
{t('pages.home.sections.second.button')}
|
|
<MoveRight />
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
<img
|
|
src={kaleenCarpet}
|
|
alt="Kaleen Carpet"
|
|
className="aspect-video rounded-lg object-cover object-center"
|
|
/>
|
|
</section>
|
|
<section className="mx-auto grid max-w-screen-2xl grid-cols-2 gap-20 px-16 py-12">
|
|
<img
|
|
src={artofWeaving}
|
|
alt="Art of Weaving"
|
|
className="aspect-video rounded-lg object-cover object-center"
|
|
/>
|
|
<div className="flex flex-col gap-4">
|
|
<div className="flex flex-col gap-1">
|
|
<h2 className="font-serif text-3xl font-medium">
|
|
{t('pages.home.sections.third.title')}
|
|
</h2>
|
|
<p className="text-gray-500">
|
|
{t('pages.home.sections.third.desc')}
|
|
</p>
|
|
</div>
|
|
<Link href={artOfWeaving()}>
|
|
<Button
|
|
variant={'outline'}
|
|
className="w-fit cursor-pointer border border-primary bg-transparent font-serif ring-primary"
|
|
>
|
|
{t('pages.home.sections.third.button')}{' '}
|
|
<MoveRight />
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</section>
|
|
<Testimonial testimonial={data?.testimonial} />
|
|
</div>
|
|
</Layout>
|
|
</>
|
|
);
|
|
}
|