109 lines
4.6 KiB
JavaScript
109 lines
4.6 KiB
JavaScript
import Link from 'next/link'
|
||
|
||
function BrandMark() {
|
||
return (
|
||
<svg
|
||
className="h-16 w-16 sm:h-20 sm:w-20"
|
||
viewBox="0 0 80 80"
|
||
fill="none"
|
||
aria-hidden="true"
|
||
>
|
||
<circle cx="40" cy="40" r="38" stroke="currentColor" strokeOpacity="0.16" />
|
||
<path
|
||
d="M40 14C25.64 14 14 25.64 14 40c0 11.55 7.53 21.34 17.95 24.72 3.25 1.05 5.45 4.08 5.45 7.5V75h5.2v-2.78c0-3.42 2.2-6.45 5.45-7.5C58.47 61.34 66 51.55 66 40 66 25.64 54.36 14 40 14Z"
|
||
fill="currentColor"
|
||
/>
|
||
<circle cx="40" cy="40" r="13" className="fill-red-700" />
|
||
</svg>
|
||
)
|
||
}
|
||
|
||
export async function generateMetadata({ params }) {
|
||
const { lang } = await params
|
||
const isFa = lang === 'fa'
|
||
|
||
return {
|
||
title: isFa ? 'بهزودی برمیگردیم | رهاورد' : 'Coming soon | Rahavard',
|
||
description: isFa
|
||
? 'وبسایت رهاورد در حال بهروزرسانی است.'
|
||
: 'The Rahavard website is being updated.',
|
||
}
|
||
}
|
||
|
||
export default async function ComingSoon({ params }) {
|
||
const { lang } = await params
|
||
const isFa = lang === 'fa'
|
||
const otherLanguage = isFa ? 'en' : 'fa'
|
||
|
||
return (
|
||
<main className="relative isolate flex min-h-screen overflow-hidden bg-[#f4f1eb] text-zinc-900">
|
||
<div
|
||
className="pointer-events-none absolute inset-0 opacity-[0.045]"
|
||
style={{
|
||
backgroundImage:
|
||
'linear-gradient(to right, #18181b 1px, transparent 1px), linear-gradient(to bottom, #18181b 1px, transparent 1px)',
|
||
backgroundSize: '48px 48px',
|
||
}}
|
||
/>
|
||
<div className="pointer-events-none absolute -left-36 -top-36 h-[30rem] w-[30rem] rounded-full bg-red-700/[0.08] blur-3xl" />
|
||
<div className="pointer-events-none absolute -bottom-56 -right-40 h-[34rem] w-[34rem] rounded-full bg-zinc-900/[0.07] blur-3xl" />
|
||
|
||
<nav className="absolute inset-x-0 top-0 z-10 flex items-center justify-between px-6 py-6 sm:px-10 sm:py-8 lg:px-16">
|
||
<div className="flex items-center gap-3" aria-label={isFa ? 'رهاورد' : 'Rahavard'}>
|
||
<span className="h-2.5 w-2.5 rounded-full bg-red-700" />
|
||
<span className="text-sm font-[4] tracking-[0.18em] sm:text-base">
|
||
{isFa ? 'رهاورد منیزیم پارسه' : 'RAHAVARD MGP'}
|
||
</span>
|
||
</div>
|
||
<Link
|
||
href={`/${otherLanguage}`}
|
||
hrefLang={otherLanguage}
|
||
className="rounded-full border border-zinc-900/15 bg-white/40 px-4 py-2 text-xs font-[5] backdrop-blur transition-colors hover:border-zinc-900/30 hover:bg-white/70 sm:text-sm"
|
||
>
|
||
{isFa ? 'English' : 'فارسی'}
|
||
</Link>
|
||
</nav>
|
||
|
||
<section className="relative z-[1] mx-auto flex w-full max-w-6xl flex-col justify-center px-6 pb-24 pt-36 sm:px-10 lg:px-16">
|
||
<div className="mb-8 flex items-center gap-5 text-zinc-900 sm:mb-10">
|
||
<BrandMark />
|
||
<div className="h-px w-16 bg-zinc-900/20 sm:w-28" />
|
||
<span className="text-xs font-[5] tracking-[0.22em] text-zinc-500 sm:text-sm">
|
||
{isFa ? 'در حال بهروزرسانی' : 'UNDER CONSTRUCTION'}
|
||
</span>
|
||
</div>
|
||
|
||
<h1 className="max-w-4xl text-[clamp(3rem,10vw,7.5rem)] font-[4] leading-[0.95] tracking-[-0.045em]">
|
||
{isFa ? (
|
||
<>
|
||
بهزودی
|
||
<br />
|
||
<span className="text-red-700">برمیگردیم.</span>
|
||
</>
|
||
) : (
|
||
<>
|
||
We'll be
|
||
<br />
|
||
<span className="text-red-700">back soon.</span>
|
||
</>
|
||
)}
|
||
</h1>
|
||
|
||
<div className="mt-9 flex max-w-2xl items-start gap-4 border-t border-zinc-900/15 pt-6 sm:mt-12 sm:gap-6 sm:pt-8">
|
||
<span className="mt-2 h-2 w-2 shrink-0 rounded-full bg-red-700 shadow-[0_0_0_6px_rgba(185,28,28,0.1)]" />
|
||
<p className="text-base font-[5] leading-8 text-zinc-600 sm:text-lg">
|
||
{isFa
|
||
? 'در حال آمادهسازی تجربهای تازه برای شما هستیم. وبسایت جدید رهاورد بهزودی در دسترس خواهد بود.'
|
||
: 'We are preparing a new experience for you. The new Rahavard website will be available shortly.'}
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<div className="absolute bottom-7 left-6 right-6 z-10 flex items-end justify-between text-[10px] font-[5] uppercase tracking-[0.16em] text-zinc-500 sm:bottom-9 sm:left-10 sm:right-10 lg:left-16 lg:right-16">
|
||
<span>{isFa ? 'قم، ایران' : 'Qom, Iran'}</span>
|
||
<span dir="ltr">© {new Date().getFullYear()} RAHAVARD MGP</span>
|
||
</div>
|
||
</main>
|
||
)
|
||
}
|