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

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

@@ -17,7 +17,7 @@ export function AppHeader() {
.catch(() => setCategories([])); .catch(() => setCategories([]));
}, []); }, []);
return ( 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]"> <div className="flex items-center gap-3 z-[100]">
<button <button
aria-label="메뉴 열기" aria-label="메뉴 열기"
@@ -87,14 +87,15 @@ export function AppHeader() {
</nav> </nav>
{mobileOpen && ( {mobileOpen && (
<div className="fixed inset-0 h-[100vh] z-40 bg-black/60 backdrop-blur-sm" onClick={() => setMobileOpen(false)}> <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 className="mb-3 h-10 flex items-center justify-between">
</div> </div>
<div className="flex flex-col gap-3"> <div className="flex flex-col gap-4">
<SearchBar /> <SearchBar />
<div className="grid grid-cols-2 gap-4">
{categories.map((cat) => ( {categories.map((cat) => (
<div key={cat.id}> <div key={cat.id}>
<div className="my-2 font-semibold text-neutral-800">{cat.name}</div> <div className="mb-2 font-semibold text-neutral-800">{cat.name}</div>
<div className="flex flex-col gap-1"> <div className="flex flex-col gap-1">
{cat.boards.map((b) => ( {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"> <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">
@@ -104,7 +105,7 @@ export function AppHeader() {
</div> </div>
</div> </div>
))} ))}
<div className="mt-3" /> </div>
</div> </div>
</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 = { export const metadata: Metadata = {
title: "msg App", title: "ASSM",
description: "msg App", description: "assm",
}; };
export default function RootLayout({ export default function RootLayout({