neodyland/tksm-ndy-mc-proj-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refactor layout to use SiteHeader component

Browse Source
This commit is contained in:
tuna2134
2026-04-06 03:40:07 +00:00
parent 82ba4c36f1
commit fe02b86b1b
2 changed files with 32 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app/layout.tsx
View File

@@ -1,8 +1,8 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Geist, Geist_Mono, Inter } from "next/font/google"; import { Geist, Geist_Mono, Inter } from "next/font/google";
import Link from "next/link";
import "./globals.css"; import "./globals.css";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { SiteHeader } from "@/components/site-header";
const inter = Inter({subsets:['latin'],variable:'--font-sans'}); const inter = Inter({subsets:['latin'],variable:'--font-sans'});
@@ -32,21 +32,7 @@ export default function RootLayout({
className={cn("h-full", "antialiased", geistSans.variable, geistMono.variable, "font-sans", inter.variable)} className={cn("h-full", "antialiased", geistSans.variable, geistMono.variable, "font-sans", inter.variable)}
> >
<body className="min-h-full flex flex-col"> <body className="min-h-full flex flex-col">
<header className="sticky top-0 z-40 border-b bg-background/85 backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-top-2 motion-safe:duration-500"> <SiteHeader />
<div className="mx-auto flex w-full max-w-6xl items-center justify-between px-4 py-3 sm:px-8">
<Link href="/" className="text-sm font-semibold tracking-tight transition-colors duration-200 hover:text-primary sm:text-base">
Takasumi-Neodyマイクラサーバプロジェクト
</Link>
<nav className="flex items-center gap-4 text-sm">
<Link href="/" className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline">
メインページ
</Link>
<Link href="/announcements" className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline">
お知らせ
</Link>
</nav>
</div>
</header>
{children} {children}
</body> </body>
</html> </html>

30
components/site-header.tsx Normal file
View File

@@ -0,0 +1,30 @@
import Link from "next/link";
export function SiteHeader() {
return (
<header className="sticky top-0 z-40 border-b bg-background/85 backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-top-2 motion-safe:duration-500">
<div className="mx-auto flex w-full max-w-6xl items-center justify-between px-4 py-3 sm:px-8">
<Link
href="/"
className="text-sm font-semibold tracking-tight transition-colors duration-200 hover:text-primary sm:text-base"
>
Takasumi-Neodyマイクラサーバプロジェクト
</Link>
<nav className="flex items-center gap-4 text-sm">
<Link
href="/"
className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline"
>
メインページ
</Link>
<Link
href="/announcements"
className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline"
>
お知らせ
</Link>
</nav>
</div>
</header>
);
}