78 lines
2.5 KiB
TypeScript
78 lines
2.5 KiB
TypeScript
import { getDictionary, type Locale } from "@/lib/dictionaries";
|
|
import ProjectsShowcase from "@/components/sections/ProjectsShowcase";
|
|
import CTA from "@/components/sections/CTA";
|
|
import { localeAlternates } from "@/lib/seo";
|
|
import type { Metadata } from "next";
|
|
|
|
export async function generateMetadata({
|
|
params,
|
|
}: {
|
|
params: Promise<{ locale: string }>;
|
|
}): Promise<Metadata> {
|
|
const { locale } = await params;
|
|
const isSR = locale === "sr";
|
|
return {
|
|
title: isSR ? "Projekti" : "Projects",
|
|
description: isSR
|
|
? "Pogledajte projekte koje sam razvio i deployovao."
|
|
: "Browse the projects I've built and deployed.",
|
|
alternates: localeAlternates(locale, "/projects"),
|
|
};
|
|
}
|
|
|
|
export default async function ProjectsPage({
|
|
params,
|
|
}: {
|
|
params: Promise<{ locale: string }>;
|
|
}) {
|
|
const { locale } = await params;
|
|
const dict = getDictionary(locale);
|
|
const t = dict.projectsPage;
|
|
|
|
return (
|
|
<>
|
|
{/* Hero */}
|
|
<section className="relative isolate flex min-h-[45svh] items-center overflow-hidden pt-32">
|
|
<div className="pointer-events-none absolute inset-0 grid-bg [mask-image:radial-gradient(ellipse_at_center,#000_30%,transparent_70%)] opacity-30" />
|
|
|
|
<div className="relative mx-auto w-full max-w-7xl px-6 lg:px-8">
|
|
<div className="mx-auto max-w-3xl text-center">
|
|
<span className="mb-6 inline-flex items-center gap-2 rounded-full border border-purple-400/30 bg-purple-500/10 px-3.5 py-1.5 font-mono text-xs tracking-tight text-purple-300 backdrop-blur-md">
|
|
{t.badge}
|
|
</span>
|
|
|
|
<h1 className="font-display text-display-xl font-medium tracking-tight">
|
|
<span className="text-gradient-fade">{t.title}</span>
|
|
<br />
|
|
<span className="text-gradient-purple">{t.titleAccent}</span>
|
|
</h1>
|
|
|
|
<p className="mx-auto mt-6 max-w-2xl text-base leading-relaxed text-text-secondary sm:text-lg">
|
|
{t.subtitle}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Deployed client projects */}
|
|
<ProjectsShowcase
|
|
locale={locale as Locale}
|
|
dict={dict}
|
|
filter="client"
|
|
sectionTitle={t.deployedTitle}
|
|
/>
|
|
|
|
{/* Personal / featured projects */}
|
|
<ProjectsShowcase
|
|
locale={locale as Locale}
|
|
dict={dict}
|
|
filter="personal"
|
|
sectionTitle={t.featuredTitle}
|
|
/>
|
|
|
|
{/* Build with me CTA */}
|
|
<CTA locale={locale as Locale} dict={dict} />
|
|
</>
|
|
);
|
|
}
|