146 lines
5.9 KiB
PHP
146 lines
5.9 KiB
PHP
@php
|
|
$sess = session('_sess', []);
|
|
$isLogin = !empty($sess['_login_']);
|
|
$name = $sess['_mname'] ?? '';
|
|
$email = $sess['_mid'] ?? '';
|
|
$display = $name !== '' ? $name : ($email !== '' ? $email : '내 계정');
|
|
@endphp
|
|
|
|
<header class="site-header">
|
|
<div class="container" style="height: 100%; display: flex; align-items: center; justify-content: space-between;">
|
|
|
|
<!-- Left: Logo & Nav -->
|
|
<div class="header-left">
|
|
<a href="{{ url('/') }}" class="logo" aria-label="홈으로">
|
|
<img src="{{ asset('assets/images/common/top_logo.png') }}"
|
|
alt="사이트명"
|
|
class="logo-img">
|
|
</a>
|
|
|
|
<nav class="desktop-nav" aria-label="주요 메뉴">
|
|
<a href="/" class="nav-link">HOME</a>
|
|
<a href="/product/list" class="nav-link nav-link--exchange">SHOP</a>
|
|
{{-- <a href="/exchange" class="nav-link nav-link--exchange">상품권현금교환</a>--}}
|
|
<a href="/mypage/info" class="nav-link">마이페이지</a>
|
|
<a href="/cs/notice" class="nav-link">고객센터</a>
|
|
</nav>
|
|
</div>
|
|
|
|
<!-- Center: Search (Desktop) -->
|
|
<div class="search-bar">
|
|
<form action="/product/list" method="GET">
|
|
<input type="text" name="search" class="search-input" placeholder="상품권/브랜드 검색">
|
|
<button type="submit" class="search-icon" aria-label="검색">
|
|
<svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
|
</svg>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Right: Auth Buttons -->
|
|
<div class="auth-buttons flex items-center gap-2">
|
|
@if($isLogin)
|
|
|
|
{{-- CTA: 핵심 행동 1개 --}}
|
|
<a href="/product/list" class="btn btn-primary" style="padding: 8px 18px;">
|
|
상품권 구매
|
|
</a>
|
|
|
|
{{-- 알림(지금은 뱃지 0으로만) --}}
|
|
<a href="{{ route('web.mypage.qna.index') }}" class="btn btn-ghost" aria-label="알림">
|
|
🔔
|
|
{{-- <span class="badge">3</span> --}}
|
|
</a>
|
|
|
|
{{-- 프로필 드롭다운 --}}
|
|
<div class="relative group header-profile">
|
|
<button type="button" class="btn btn-ghost">
|
|
<span class="truncate max-w-[120px]">{{ $display }}</span>
|
|
<span class="ml-1">▾</span>
|
|
</button>
|
|
|
|
<div class="absolute right-0 mt-2 w-48 hidden group-hover:block profile-dropdown">
|
|
<div class="rounded-xl border bg-white shadow-lg overflow-hidden profile-card">
|
|
<div class="px-4 py-3 text-xs text-gray-500 profile-meta">
|
|
{{ $email }}
|
|
</div>
|
|
<div class="border-t profile-sep"></div>
|
|
|
|
<a class="block px-4 py-2 hover:bg-gray-50" href="{{ route('web.mypage.info.index') }}">내 정보</a>
|
|
<a class="block px-4 py-2 hover:bg-gray-50" href="{{ route('web.mypage.usage.index') }}">구매내역</a>
|
|
<a class="block px-4 py-2 hover:bg-gray-50" href="{{ route('web.cs.qna.index') }}">1:1 문의</a>
|
|
|
|
<div class="border-t profile-sep"></div>
|
|
|
|
{{-- 로그아웃: POST 권장(라우트는 네가 만들거나 기존거 사용) --}}
|
|
<form action="{{ route('web.auth.logout') }}" method="post">
|
|
@csrf
|
|
<button type="submit" class="w-full text-left px-4 py-2 hover:bg-gray-50 logout-btn">
|
|
로그아웃
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@else
|
|
<a href="/login" class="btn btn-ghost">로그인</a>
|
|
<a href="/register" class="btn btn-primary" style="padding: 8px 20px;">회원가입</a>
|
|
|
|
@endif
|
|
</div>
|
|
|
|
<!-- Mobile Menu Toggle -->
|
|
<button class="mobile-menu-btn" type="button" aria-label="메뉴 열기" aria-controls="mobile-drawer" aria-expanded="false">
|
|
<svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- Mobile Drawer -->
|
|
@include('web.partials.mobile-drawer')
|
|
|
|
<!-- Mobile Drawer Overlay -->
|
|
<div class="mobile-drawer-overlay" data-drawer-close hidden></div>
|
|
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Mobile Breakpoint Adjustments will be handled in CSS media queries -->
|
|
<style>
|
|
@media (max-width: 1024px) {
|
|
|
|
/* 메뉴/로그인만 숨김 */
|
|
.desktop-nav,
|
|
.auth-buttons {
|
|
display: none !important;
|
|
}
|
|
|
|
/* 검색은 유지 + 모바일 폭 최적화 */
|
|
.search-bar {
|
|
display: block !important;
|
|
flex: 1 1 auto;
|
|
max-width: none;
|
|
min-width: 0;
|
|
margin: 0 10px;
|
|
}
|
|
.search-bar form { width: 100%; }
|
|
.search-input { width: 100%; }
|
|
|
|
/* 햄버거 버튼 표시 */
|
|
.mobile-menu-btn {
|
|
display: block !important;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 480px) {
|
|
.site-header .container{
|
|
padding-left: 12px;
|
|
padding-right: 12px;
|
|
}
|
|
}
|
|
</style>
|
|
|