Add footer and improve layout structure

- Create Footer component with links to GitHub and Mastodon
- Restructure root layout with flex column for sticky footer
- Update OS layout to use flex-1 for proper height inheritance
This commit is contained in:
cc
2026-04-14 19:36:59 +02:00
parent 2b9dd986b2
commit 614511d59a
3 changed files with 40 additions and 6 deletions
+9 -5
View File
@@ -4,6 +4,7 @@ import { ThemeProvider } from "next-themes";
import "./globals.css";
import { NavTop } from "@/components/navtop";
import { Footer } from "@/components/footer";
import { Toaster } from "@/components/ui/sonner";
import { Suspense } from "react";
@@ -34,11 +35,14 @@ export default function RootLayout({
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
<NavTop />
<Toaster />
<Suspense>
<main className="flex flex-col">{children}</main>
</Suspense>
<div className="flex flex-col min-h-screen">
<NavTop />
<Toaster />
<Suspense>
<main className="flex-1 flex flex-col">{children}</main>
</Suspense>
<Footer />
</div>
</ThemeProvider>
</body>
</html>
+1 -1
View File
@@ -38,7 +38,7 @@ export default function OSDetailLayout({
}, [os]);
return (
<div className="flex flex-col h-[calc(100vh-56px)] p-4 md:p-6" suppressHydrationWarning>
<div className="flex flex-col flex-1 min-h-0 p-4 md:p-6" suppressHydrationWarning>
<header className="flex flex-col sm:flex-row sm:items-center gap-2 mb-4 shrink-0">
<div className="flex items-center gap-4">
<Breadcrumb>
+30
View File
@@ -0,0 +1,30 @@
export function Footer() {
return (
<footer className="border-t border-border bg-muted/30 mt-auto">
<div className="px-4 md:px-8 py-6">
<div className="flex flex-col sm:flex-row items-center justify-between gap-4 text-sm text-muted-foreground">
<span>entdb</span>
<div className="flex items-center gap-4">
<a
href="https://github.com/chichou/entdb-indexer"
target="_blank"
rel="noopener noreferrer"
className="hover:text-foreground transition-colors"
>
GitHub
</a>
<a
href="https://infosec.exchange/@codecolorist"
target="_blank"
rel="noopener noreferrer"
className="hover:text-foreground transition-colors"
>
Mastodon
</a>
</div>
</div>
</div>
</footer>
);
}