Naser Mansour
117 lines
5.4 KiB
PHP
117 lines
5.4 KiB
PHP
@php
|
|
$isAr = app()->getLocale() === 'ar';
|
|
$links = [
|
|
['key' => 'home', 'href' => route('home'), 'label' => __('site.nav_home'), 'current' => request()->routeIs('home')],
|
|
['key' => 'about', 'href' => route('about'), 'label' => __('site.nav_about'), 'current' => request()->routeIs('about')],
|
|
['key' => 'services', 'href' => route('home').'#services', 'label' => __('site.nav_services'), 'current' => false],
|
|
['key' => 'posts', 'href' => route('posts.index'), 'label' => __('site.nav_articles'), 'current' => request()->routeIs('posts*')],
|
|
['key' => 'booking', 'href' => route('booking'), 'label' => __('site.nav_booking'), 'current' => request()->routeIs('booking*')],
|
|
];
|
|
$langHref = url('/language/'.($isAr ? 'en' : 'ar'));
|
|
$langText = $isAr ? 'EN' : 'ع';
|
|
@endphp
|
|
<header
|
|
x-data="{ mobileMenuOpen: false }"
|
|
class="nav"
|
|
id="site-nav"
|
|
data-test="main-navigation"
|
|
>
|
|
<div class="wrap">
|
|
<a href="{{ route('home') }}" class="brand" aria-label="{{ __('site.brand_label') }}" wire:navigate>
|
|
<span class="seal" style="background-image:url('{{ asset('images/logo.png') }}')"></span>
|
|
<span>
|
|
<b>{{ __('site.brand_name') }}</b>
|
|
<small>{{ __('site.brand_sub') }}</small>
|
|
</span>
|
|
</a>
|
|
|
|
<nav class="links" aria-label="{{ __('site.nav_main') }}">
|
|
@foreach ($links as $link)
|
|
<a
|
|
href="{{ $link['href'] }}"
|
|
@if ($link['current']) aria-current="page" @endif
|
|
wire:navigate
|
|
data-test="nav-{{ $link['key'] }}"
|
|
>{{ $link['label'] }}</a>
|
|
@endforeach
|
|
</nav>
|
|
|
|
<div class="nav-tools">
|
|
<a class="lang" href="{{ $langHref }}" aria-label="{{ __('site.lang_switch') }}" data-test="nav-language">{{ $langText }}</a>
|
|
|
|
@auth
|
|
@php
|
|
$dashboardRoute = auth()->user()->isAdmin() ? route('admin.dashboard') : route('client.dashboard');
|
|
@endphp
|
|
<a class="login" href="{{ $dashboardRoute }}" wire:navigate data-test="nav-dashboard">{{ __('navigation.dashboard') }}</a>
|
|
<form method="POST" action="{{ route('logout') }}" class="inline">
|
|
@csrf
|
|
<button type="submit" class="login" data-test="nav-logout">{{ __('navigation.logout') }}</button>
|
|
</form>
|
|
@else
|
|
<a class="login" href="{{ route('login') }}" wire:navigate data-test="nav-login">{{ __('site.nav_login') }}</a>
|
|
@endauth
|
|
|
|
<a class="btn btn-gold" href="{{ route('home') }}#book">{{ __('site.nav_book') }}</a>
|
|
|
|
<button
|
|
type="button"
|
|
class="menu-btn"
|
|
@click="mobileMenuOpen = !mobileMenuOpen"
|
|
:aria-expanded="mobileMenuOpen"
|
|
aria-label="{{ __('site.nav_menu') }}"
|
|
data-test="mobile-menu-button"
|
|
>
|
|
<svg x-show="!mobileMenuOpen" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
<svg x-show="mobileMenuOpen" x-cloak class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile menu sheet -->
|
|
<div
|
|
x-show="mobileMenuOpen"
|
|
x-trap.inert.noscroll="mobileMenuOpen"
|
|
x-transition:enter="transition ease-out duration-200"
|
|
x-transition:enter-start="opacity-0 -translate-y-1"
|
|
x-transition:enter-end="opacity-100 translate-y-0"
|
|
x-transition:leave="transition ease-in duration-150"
|
|
x-transition:leave-start="opacity-100 translate-y-0"
|
|
x-transition:leave-end="opacity-0 -translate-y-1"
|
|
x-cloak
|
|
@click.away="mobileMenuOpen = false"
|
|
@keydown.escape.window="mobileMenuOpen = false"
|
|
class="menu-sheet"
|
|
role="dialog"
|
|
aria-modal="true"
|
|
aria-label="{{ __('site.nav_menu') }}"
|
|
data-test="mobile-menu"
|
|
>
|
|
@foreach ($links as $link)
|
|
<a
|
|
href="{{ $link['href'] }}"
|
|
@if ($link['current']) aria-current="page" @endif
|
|
wire:navigate
|
|
@click="mobileMenuOpen = false"
|
|
data-test="mobile-nav-{{ $link['key'] }}"
|
|
>{{ $link['label'] }}</a>
|
|
@endforeach
|
|
|
|
@auth
|
|
<a href="{{ $dashboardRoute }}" wire:navigate @click="mobileMenuOpen = false" data-test="mobile-nav-dashboard">{{ __('navigation.dashboard') }}</a>
|
|
<form method="POST" action="{{ route('logout') }}">
|
|
@csrf
|
|
<button type="submit" data-test="mobile-nav-logout">{{ __('navigation.logout') }}</button>
|
|
</form>
|
|
@else
|
|
<a href="{{ route('login') }}" wire:navigate @click="mobileMenuOpen = false" data-test="mobile-nav-login">{{ __('site.nav_login') }}</a>
|
|
@endauth
|
|
|
|
<a class="btn btn-gold" href="{{ route('home') }}#book" @click="mobileMenuOpen = false">{{ __('site.nav_book') }}</a>
|
|
</div>
|
|
</header>
|