feat(ui): 메인 레이아웃/홈 페이지를 타깃 사이트 구조로 Tailwind 클론

- layout.tsx: 상단 고정 헤더/중앙 컨테이너/푸터 구성
- page.tsx: 히어로 + 12그리드 메인 + 하단 3컬럼 섹션 추가
- globals.css: 테마 변수/폰트/중립 배경 헬퍼 추가

Refs: @101101_메인페이지구성.md
This commit is contained in:
koreacomp5
2025-10-11 18:32:06 +09:00
parent 0e8eb2e85e
commit 54b785420f
4 changed files with 56 additions and 20 deletions

View File

@@ -2,7 +2,6 @@ import type { Metadata } from "next";
import "./globals.css";
import QueryProvider from "@/app/QueryProvider";
import { AppHeader } from "@/app/components/AppHeader";
import { AppSidebar } from "@/app/components/AppSidebar";
import { AppFooter } from "@/app/components/AppFooter";
import { ToastProvider } from "@/app/components/ui/ToastProvider";
@@ -18,16 +17,27 @@ export default function RootLayout({
children: React.ReactNode;
}>) {
return (
<html lang="en">
<body>
<html lang="ko">
<body className="min-h-screen bg-background text-foreground antialiased">
<QueryProvider>
<ToastProvider>
<AppHeader />
<div style={{ display: "flex", minHeight: "80vh" }}>
<AppSidebar />
<main style={{ flex: 1, padding: 16 }}>{children}</main>
<div className="min-h-screen flex flex-col">
<div className="sticky top-0 z-50 border-b bg-white/80 backdrop-blur">
<div className="max-w-7xl mx-auto px-4">
<AppHeader />
</div>
</div>
<main className="flex-1">
<div className="max-w-7xl mx-auto px-4 py-6">
{children}
</div>
</main>
<div className="border-t">
<div className="max-w-7xl mx-auto px-4">
<AppFooter />
</div>
</div>
</div>
<AppFooter />
</ToastProvider>
</QueryProvider>
</body>