98 lines
6.4 KiB
PHP
98 lines
6.4 KiB
PHP
{{--resources/views/components/partials/header.blade.php--}}
|
|
<div
|
|
class="#sticky top-0 w-full border-b hr rounded-lg">
|
|
|
|
<header id="header" class="header w-full rounded-r-2xl rounded-l-none">
|
|
<nav class="flex h-[71px] #h-[74px] items-center justify-between #p-3">
|
|
<div class="#flex-1 md:w-3/5 w-full">
|
|
<div class="flex items-center gap-5">
|
|
<button id="sidebar-toggle-btn"
|
|
class="action-button sidebar-toggle flex items-center justify-center p-1.5 shadow-2xl rounded">
|
|
<svg class="size-5 group-[.expanded]/side:rotate-180"
|
|
fill="none" stroke="currentColor" stroke-width="1.5"
|
|
viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
<path stroke-linecap="round" stroke-linejoin="round"
|
|
d="M9 5l7 7-7 7"></path>
|
|
</svg>
|
|
</button>
|
|
<div class="flex items-center gap-3">
|
|
<h1 class="font-bold text-2xl">@yield('header_title')</h1>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center justify-end gap-2 w-full max-w-96">
|
|
<a href="#" class="btn-ghost text-xs px-2 py-1"><i class="ph ph-plus mr-1"></i><span>Domain</span></a>
|
|
@foreach($header as $section)
|
|
<div class="#modal-button #relative #mr-2">
|
|
<div class="#p-1.5">
|
|
@if(!$section['image'])
|
|
<div x-data="{ openMessages: false }" class="relative flex items-center">
|
|
<button @click="openMessages = !openMessages" class="btn-ghost text-base !p-2"><i class="ph-duotone ph-bell #mr-1"></i></button>
|
|
<div
|
|
x-show="openMessages"
|
|
@click.away="openMessages = false"
|
|
x-cloak
|
|
class="popup absolute top-16 right-0 w-48"
|
|
x-transition:enter="transition ease-out duration-100"
|
|
x-transition:enter-start="opacity-0 transform scale-95"
|
|
x-transition:enter-end="opacity-100 transform scale-100"
|
|
x-transition:leave="transition ease-in duration-75"
|
|
x-transition:leave-start="opacity-100 transform scale-100"
|
|
x-transition:leave-end="opacity-0 transform scale-95"
|
|
>
|
|
<div class="flex items-center justify-center h-40">
|
|
Keine Nachrichten
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@else
|
|
<div x-data="{ openMenu: false }" class="relative flex items-center">
|
|
<button @click="openMenu = !openMenu"
|
|
class="flex items-center focus:outline-none">
|
|
<img class="size-8 rounded-full object-cover shadow-2xl"
|
|
src="https://i.pravatar.cc/100"
|
|
alt="Avatar"/>
|
|
<svg
|
|
class="size-4 ml-2 text-gray-500 transform transition-transform duration-200"
|
|
:class="{'rotate-180': open}"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M19 9l-7 7-7-7"/>
|
|
</svg>
|
|
</button>
|
|
<div
|
|
x-show="openMenu"
|
|
@click.away="openMenu = false"
|
|
x-cloak
|
|
class="popup absolute top-16 right-0 w-48"
|
|
x-transition:enter="transition ease-out duration-100"
|
|
x-transition:enter-start="opacity-0 transform scale-95"
|
|
x-transition:enter-end="opacity-100 transform scale-100"
|
|
x-transition:leave="transition ease-in duration-75"
|
|
x-transition:leave-start="opacity-100 transform scale-100"
|
|
x-transition:leave-end="opacity-0 transform scale-95"
|
|
>
|
|
@foreach($section['sub'] as $sub)
|
|
<a href="{{ route($sub['route']) }}"
|
|
class="block px-4 py-2 text-xs #text-gray-700 #hover:bg-gray-100 #hover:text-black #hover:bg-gradient-to-r #hover:from-[rgba(var(--accent))] #hover:to-transparent">
|
|
<div class="flex items-center gap-3">
|
|
<span>Logo</span>
|
|
{{-- <span><x-dynamic-component :component="$sub['icon']"--}}
|
|
{{-- class="!size-4"/></span>--}}
|
|
<span>{{ $sub['title'] }}</span>
|
|
</div>
|
|
</a>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
</div>
|