mguilbert/matheoguilbert.fr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed design project page

Browse Source
This commit is contained in:
Mathéo GUILBERT
2026-04-16 10:47:28 +02:00
parent 5e1368f790
commit 2bf8bae473
12 changed files with 65 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/sections/ProjectHero.tsx
+24 -20
View File
@@ -1,32 +1,36 @@
import Link from "next/link";
type Props = {
import { GoArrowLeft } from "react-icons/go";
type props = {
title: string;
subtitle: string;
year: number;
description: string;
dateLabel: string;
locale: string;
};
export function ProjectHero({ title, subtitle, year, locale }: Props) {
export function ProjectHero({ title, description, dateLabel, locale }: props) {
return (
<section className="rounded-[28px] bg-[#2b160f] px-6 py-16 text-white md:px-12 md:py-28">
<Link
href={`/${locale}/works`}
className="mb-10 inline-flex text-sm text-white/80 hover:text-white"
>
← Retour aux projets
</Link>
<div className="md:pt-22">
<section className="rounded-[10px] bg-brand-brown flex flex-col items-center justify-center text-brand-beige px-6 py-4">
<Link
href={`/${locale}#works`}
className="w-full mb-10 inline-flex items-center justify-start gap-2 text-sm text-brand-beige"
>
<GoArrowLeft /> Retour aux projets
</Link>
<div className="mx-auto flex min-h-[360px] max-w-4xl flex-col items-center justify-center text-center">
<h1 className="text-5xl font-semibold md:text-7xl">{title}</h1>
<p className="mt-4 text-lg text-white/80 md:text-2xl">{subtitle}</p>
<div className="mx-auto flex min-h-90 max-w-4xl flex-col items-center justify-center text-center">
<h1 className="text-5xl font-serif md:text-7xl">{title}</h1>
<p className="mt-4 font-sans text-base text-brand-beige/80">{description}</p>
<div className="mt-8 flex items-center gap-4 text-sm text-white/70">
<span className="h-px w-16 bg-white/30" />
<span>{year}</span>
<span className="h-px w-16 bg-white/30" />
<div className="mt-8 flex items-center gap-4 text-sm text-brand-beige/70">
<span className="h-px w-16 bg-white/30" />
<span>{dateLabel}</span>
<span className="h-px w-16 bg-white/30" />
</div>
</div>
</div>
</section>
</section>
</div>
);
}