motaju/msgapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

헤더 또수정

Browse Source
This commit is contained in:
mota
2025-10-13 10:07:10 +09:00
parent 8414512709
commit 6e4563a40a
2 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/app/components/AppHeader.tsx
View File

@@ -17,7 +17,7 @@ export function AppHeader() {
.catch(() => setCategories([]));
}, []);
return (
<header className="relative flex items-center justify-between px-4 py-3 border-b bg-white/80 backdrop-blur supports-[backdrop-filter]:bg-white/60">
<header className="relative flex items-center justify-between px-4 py-3 bg-white/80 backdrop-blur supports-[backdrop-filter]:bg-white/60">
<div className="flex items-center gap-3 z-[100]">
<button
aria-label="메뉴 열기"
@@ -87,24 +87,25 @@ export function AppHeader() {
</nav>
{mobileOpen && (
<div className="fixed inset-0 h-[100vh] z-40 bg-black/60 backdrop-blur-sm" onClick={() => setMobileOpen(false)}>
<div className="absolute left-0 xl:top-0 h-[100vh] w-4/5 max-w-sm bg-white p-4 shadow-xl overflow-y-auto" onClick={(e) => e.stopPropagation()}>
<div className="absolute left-0 xl:top-0 h-[100vh] w-11/12 max-w-md bg-white p-4 shadow-xl overflow-y-auto" onClick={(e) => e.stopPropagation()}>
<div className="mb-3 h-10 flex items-center justify-between">
</div>
<div className="flex flex-col gap-3">
<div className="flex flex-col gap-4">
<SearchBar />
{categories.map((cat) => (
<div key={cat.id}>
<div className="my-2 font-semibold text-neutral-800">{cat.name}</div>
<div className="flex flex-col gap-1">
{cat.boards.map((b) => (
<Link key={b.id} href={`/boards/${b.id}`} onClick={() => setMobileOpen(false)} className="rounded px-2 py-1 text-neutral-700 hover:bg-neutral-100 hover:text-neutral-900">
{b.name}
</Link>
))}
<div className="grid grid-cols-2 gap-4">
{categories.map((cat) => (
<div key={cat.id}>
<div className="mb-2 font-semibold text-neutral-800">{cat.name}</div>
<div className="flex flex-col gap-1">
{cat.boards.map((b) => (
<Link key={b.id} href={`/boards/${b.id}`} onClick={() => setMobileOpen(false)} className="rounded px-2 py-1 text-neutral-700 hover:bg-neutral-100 hover:text-neutral-900">
{b.name}
</Link>
))}
</div>
</div>
</div>
))}
<div className="mt-3" />
))}
</div>
</div>
</div>
</div>

4
src/app/layout.tsx
View File

@@ -7,8 +7,8 @@ import { ToastProvider } from "@/app/components/ui/ToastProvider";
export const metadata: Metadata = {
title: "msg App",
description: "msg App",
title: "ASSM",
description: "assm",
};
export default function RootLayout({