Files
engel/app/[locale]/teachers/page.js
2026-04-21 07:37:18 +03:30

46 lines
1.8 KiB
JavaScript

import Image from "next/image";
import Link from "next/link";
import { notFound } from "next/navigation";
import { getLandingContent, isSupportedLocale, locales } from "@/lib/site-data";
export function generateStaticParams() {
return locales.map((locale) => ({ locale }));
}
export default async function TeachersPage({ params }) {
const { locale } = await params;
if (!isSupportedLocale(locale)) {
notFound();
}
const { teachers, navigation, shared } = getLandingContent(locale);
return (
<main className="min-h-screen bg-brand-light text-gray-800">
<section className="mx-auto max-w-6xl px-6 py-16">
<Link href={`/${locale}`} className="text-sm font-semibold text-brand-purple">
{navigation.homeLabel}
</Link>
<h1 className="mt-4 text-4xl font-bold text-brand-dark">{navigation.teachers}</h1>
<p className="mt-3 max-w-2xl text-gray-600">{shared.teachersIntro}</p>
<div className="mt-12 grid gap-8 sm:grid-cols-2 lg:grid-cols-4">
{teachers.map((teacher) => (
<article key={teacher.slug} className="overflow-hidden rounded-2xl bg-white shadow-sm">
<Image src={teacher.image} alt={teacher.name} width={600} height={700} className="h-64 w-full object-cover" />
<div className="p-6">
<div className="flex items-center justify-between gap-4">
<h2 className="text-xl font-bold">{teacher.name}</h2>
<span className="text-xl" aria-hidden="true">{teacher.flag}</span>
</div>
<p className="mt-3 text-sm font-semibold text-brand-purple">{teacher.title}</p>
<p className="mt-3 text-sm text-gray-500">{teacher.description}</p>
</div>
</article>
))}
</div>
</section>
</main>
);
}