mohs/sass-mohfarawati
1
0
Fork 0
Code Issues Pull Requests Actions 8 Packages Projects Releases Wiki Activity

feat(ui): admin-only root link and shared header navigation
CI / quality (push) Waiting to run
Details

Browse Source
This commit is contained in:
MOH
2026-03-06 16:50:45 +01:00
parent 7a20cf5c75
commit ce63cd8b69
32 changed files with 1070 additions and 600 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/[locale]/(site)/contact/page.tsx
+51 -65
View File
@@ -3,6 +3,11 @@ import Link from "next/link";
import { MotionFade } from "@/components/motion-fade";
import { resolveLocale } from "@/lib/site-data";
import { Button } from "@/src/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/src/components/ui/card";
import { Input } from "@/src/components/ui/input";
import { Label } from "@/src/components/ui/label";
import { Textarea } from "@/src/components/ui/textarea";
type ContactPageProps = {
params: {
@@ -43,77 +48,58 @@ export default function ContactPage({ params: { locale } }: ContactPageProps) {
return (
<div className="mx-auto grid w-full max-w-6xl gap-6 px-4 py-10 sm:px-6 lg:grid-cols-2 lg:px-8 lg:py-14">
<MotionFade>
<section className="rounded-3xl border border-zinc-200 bg-white p-6 dark:border-zinc-800 dark:bg-zinc-950 lg:p-8">
<h1 className="text-3xl font-semibold text-zinc-900 dark:text-zinc-100 sm:text-4xl">
{copy.title}
</h1>
<p className="mt-4 text-base text-zinc-600 dark:text-zinc-300 sm:text-lg">
{copy.intro}
</p>
<ul className="mt-6 space-y-3 text-sm text-zinc-700 dark:text-zinc-200">
<li className="inline-flex items-center gap-2">
<Phone className="h-4 w-4" />
{copy.phone}
</li>
<li className="inline-flex items-center gap-2">
<Mail className="h-4 w-4" />
{copy.mail}
</li>
<li className="inline-flex items-center gap-2">
<MapPin className="h-4 w-4" />
{copy.city}
</li>
</ul>
</section>
<Card>
<CardHeader>
<CardTitle className="text-3xl sm:text-4xl">{copy.title}</CardTitle>
<p className="text-base text-muted-foreground sm:text-lg">{copy.intro}</p>
</CardHeader>
<CardContent>
<ul className="space-y-3 text-sm text-foreground/85">
<li className="inline-flex items-center gap-2">
<Phone className="h-4 w-4" />
{copy.phone}
</li>
<li className="inline-flex items-center gap-2">
<Mail className="h-4 w-4" />
{copy.mail}
</li>
<li className="inline-flex items-center gap-2">
<MapPin className="h-4 w-4" />
{copy.city}
</li>
</ul>
</CardContent>
</Card>
</MotionFade>
<MotionFade delay={0.05}>
<section className="rounded-3xl border border-zinc-200 bg-white p-6 dark:border-zinc-800 dark:bg-zinc-950 lg:p-8">
<form className="grid gap-4">
<label className="grid gap-2 text-sm text-zinc-700 dark:text-zinc-200">
{copy.name}
<input
type="text"
className="rounded-lg border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 outline-none transition focus:border-zinc-500 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100"
placeholder={copy.name}
/>
</label>
<Card>
<CardContent className="pt-6">
<form className="grid gap-4">
<Label className="grid gap-2">
{copy.name}
<Input type="text" placeholder={copy.name} />
</Label>
<label className="grid gap-2 text-sm text-zinc-700 dark:text-zinc-200">
{copy.email}
<input
type="email"
className="rounded-lg border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 outline-none transition focus:border-zinc-500 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100"
placeholder={copy.email}
/>
</label>
<Label className="grid gap-2">
{copy.email}
<Input type="email" placeholder={copy.email} />
</Label>
<label className="grid gap-2 text-sm text-zinc-700 dark:text-zinc-200">
{copy.message}
<textarea
rows={5}
className="rounded-lg border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 outline-none transition focus:border-zinc-500 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100"
placeholder={copy.message}
/>
</label>
<Label className="grid gap-2">
{copy.message}
<Textarea rows={5} placeholder={copy.message} />
</Label>
<div className="flex flex-wrap gap-3">
<button
type="button"
className="inline-flex rounded-lg bg-zinc-900 px-4 py-2.5 text-sm font-medium text-white transition hover:bg-zinc-700 dark:bg-zinc-100 dark:text-zinc-900 dark:hover:bg-zinc-300"
>
{copy.submit}
</button>
<Link
href={`/${localeKey}/success`}
className="inline-flex rounded-lg border border-zinc-300 px-4 py-2.5 text-sm font-medium text-zinc-700 transition hover:bg-zinc-100 dark:border-zinc-700 dark:text-zinc-200 dark:hover:bg-zinc-800"
>
{copy.preview}
</Link>
</div>
</form>
</section>
<div className="flex flex-wrap gap-3">
<Button type="button">{copy.submit}</Button>
<Button asChild variant="outline">
<Link href={`/${localeKey}/success`}>{copy.preview}</Link>
</Button>
</div>
</form>
</CardContent>
</Card>
</MotionFade>
</div>
);