45 lines
1.9 KiB
PHP
45 lines
1.9 KiB
PHP
@props(['title' => null, 'subtitle' => null])
|
|
|
|
<header class="topbar-blur sticky top-0 z-40 flex items-center gap-3 px-5 lg:px-[26px] py-3.5 border-b border-line-soft">
|
|
{{-- mobile nav trigger --}}
|
|
<button type="button" @click="nav = true"
|
|
class="lg:hidden grid place-items-center w-9 h-9 rounded-lg text-ink-2 hover:bg-raised hover:text-ink transition-colors"
|
|
aria-label="{{ __('common.menu') }}">
|
|
<x-icon name="menu" :size="20" />
|
|
</button>
|
|
|
|
<div class="min-w-0">
|
|
@if ($title)
|
|
<h1 class="text-[15px] font-bold text-ink leading-tight truncate">{{ $title }}</h1>
|
|
@endif
|
|
@if ($subtitle)
|
|
<p class="text-[12px] text-ink-3 truncate">{{ $subtitle }}</p>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="ml-auto flex items-center gap-3">
|
|
<span class="hidden sm:inline-flex items-center gap-1.5 rounded-full bg-raised border border-line-soft px-2.5 py-1 text-[11px] font-semibold text-ink-2">
|
|
<span class="w-[7px] h-[7px] rounded-full bg-accent pulse-live"></span>
|
|
{{ __('common.live') }}
|
|
</span>
|
|
|
|
@auth
|
|
<span class="hidden sm:flex items-center gap-2 text-[12px] text-ink-2">
|
|
<span class="grid place-items-center w-7 h-7 rounded-full bg-inset text-ink-2">
|
|
<x-icon name="user" :size="15" />
|
|
</span>
|
|
<span class="font-mono">{{ auth()->user()->name }}</span>
|
|
</span>
|
|
|
|
<form method="POST" action="{{ route('logout') }}">
|
|
@csrf
|
|
<button type="submit"
|
|
class="grid place-items-center w-9 h-9 rounded-lg text-ink-2 hover:bg-raised hover:text-ink transition-colors"
|
|
aria-label="{{ __('common.logout') }}" title="{{ __('common.logout') }}">
|
|
<x-icon name="logout" :size="18" />
|
|
</button>
|
|
</form>
|
|
@endauth
|
|
</div>
|
|
</header>
|