Skip to content

Commit b8cbc56

Browse files
hchangclaude
andcommitted
style: 헤더 디자인 개선
- 모두콘2025 텍스트 → SVG 로고로 변경 (가운데 정렬) - SVG 로고 흰색으로 변경 및 좌우 여백 추가 - 왼쪽에 홈 아이콘 추가 - 오른쪽 프로필은 로그인 시만 표시 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
1 parent 1bf1f57 commit b8cbc56

2 files changed

Lines changed: 40 additions & 8 deletions

File tree

Lines changed: 13 additions & 0 deletions
Loading

moducon-frontend/src/components/layout/Header.tsx

Lines changed: 27 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
'use client';
22

33
import Link from 'next/link';
4+
import Image from 'next/image';
45
import { useAuthStore } from '@/store/authStore';
5-
import ModulabsLogo from '@/imports/Group-53-445';
6+
import { Home } from 'lucide-react';
67

78
export function Header() {
89
const { user } = useAuthStore();
@@ -14,15 +15,31 @@ export function Header() {
1415

1516
return (
1617
<header className="sticky top-0 z-50 w-full bg-gradient-to-r from-[#FF6B9D] via-[#FF8B5A] to-[#FFA94D] shadow-lg">
17-
<div className="container flex h-14 items-center justify-between px-4">
18-
<Link href="/home/" className="flex items-center gap-3">
19-
<div className="w-20 h-8">
20-
<ModulabsLogo />
21-
</div>
22-
<span className="text-lg font-bold text-white">모두콘 2025</span>
18+
<div className="container flex h-14 items-center px-4">
19+
{/* 왼쪽: 홈 아이콘 */}
20+
<Link
21+
href="/home"
22+
className="w-9 h-9 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors"
23+
>
24+
<Home className="w-5 h-5 text-white" />
2325
</Link>
2426

25-
{user && (
27+
{/* 가운데: 로고 */}
28+
<div className="flex-1 flex justify-center">
29+
<Link href="/home">
30+
<Image
31+
src="/images/moducon2025.svg"
32+
alt="모두콘 2025"
33+
width={120}
34+
height={36}
35+
className="h-7 w-auto"
36+
priority
37+
/>
38+
</Link>
39+
</div>
40+
41+
{/* 오른쪽: 프로필 (로그인 시만) */}
42+
{user ? (
2643
<Link
2744
href="/mypage"
2845
className="w-9 h-9 rounded-full bg-white/20 hover:bg-white/30 flex items-center justify-center transition-colors border-2 border-white/50"
@@ -31,6 +48,8 @@ export function Header() {
3148
{getInitial(user.name)}
3249
</span>
3350
</Link>
51+
) : (
52+
<div className="w-9 h-9" /> // 빈 공간으로 균형 맞춤
3453
)}
3554
</div>
3655
</header>

0 commit comments

Comments
 (0)