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

improved styling of the header component

Browse Source
This commit is contained in:
Mathéo GUILBERT
2026-04-15 10:10:15 +02:00
parent 3bcb45372f
commit 59973de815
2 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/[locale]/layout.tsx
+16 -16
View File
@@ -4,31 +4,31 @@ import "./globals.css";
import Header from "@/components/layout/Header";
const playfairDisplay = Playfair_Display({
variable: "--font-playfair",
subsets: ["latin"],
variable: "--font-playfair",
subsets: ["latin"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
variable: "--font-inter",
subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Mathéo Guilbert - Développeur Full Stack",
description: "Portfolio de Mathéo Guilbert, développeur web freelance.",
title: "Mathéo Guilbert - Développeur Full Stack",
description: "Portfolio de Mathéo Guilbert, développeur web freelance.",
};
export default function RootLayout({
children,
children,
}: Readonly<{
children: React.ReactNode;
children: React.ReactNode;
}>) {
return (
<html lang="fr" className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige m-[11px] antialiased`}>
<body className="min-h-screen flex flex-col bg-brand-beige text-brand-brown">
<Header />
{children}
</body>
</html>
);
return (
<html lang="fr" className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige m-[11px] antialiased`}>
<body className="min-h-screen flex flex-col bg-brand-beige text-brand-brown">
<Header />
{children}
</body>
</html>
);
}
components/layout/Header.tsx
+4 -4
View File
@@ -1,16 +1,16 @@
export default function Header() {
return (
<header className="bg-brand-brown text-brand-beige w-full py-6 px-10 flex justify-between items-center">
<div className="font-serif text-2xl font-bold">M. Guilbert</div>
<header className="bg-brand-brown text-brand-beige w-full py-6 px-10 flex justify-between items-center rounded-[10px]">
<div className="font-serif text-2xl font-light">M. Guilbert</div>
<nav>
<ul className="flex gap-8 font-sans uppercase text-sm tracking-widest">
<ul className="flex gap-8 font-sans text-base font-light">
<li>Accueil</li>
<li>Projets</li>
<li>À propos</li>
<li>Blog</li>
</ul>
</nav>
<div>🇫🇷</div>
<div className="font-sans text-base font-light">France</div>
</header>
);
}