mirror of
https://github.com/pacnpal/thrillwiki_laravel.git
synced 2025-12-20 11:31:09 -05:00
Implement HomeController, update home route, and enhance menu components with close functionality
This commit is contained in:
@@ -1,34 +1,45 @@
|
||||
<div class="relative">
|
||||
<div
|
||||
wire:click="toggle"
|
||||
class="flex items-center justify-center w-8 h-8 text-gray-500 transition-transform rounded-full cursor-pointer hover:text-primary dark:text-gray-400 dark:hover:text-primary hover:scale-105"
|
||||
<button
|
||||
wire:click.stop="toggle"
|
||||
type="button"
|
||||
role="button"
|
||||
aria-expanded="{{ $isOpen }}"
|
||||
aria-label="Authentication menu"
|
||||
class="p-2 text-gray-300 transition-all duration-200 hover:text-white hover:scale-105 focus:outline-none focus:ring-2 focus:ring-primary/20 rounded-lg"
|
||||
>
|
||||
<i class="text-xl fas fa-user"></i>
|
||||
</div>
|
||||
<svg class="w-6 h-6" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2M12 11a4 4 0 100-8 4 4 0 000 8z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<!-- Auth Menu -->
|
||||
<div
|
||||
wire:model="isOpen"
|
||||
class="bg-white dropdown-menu dark:bg-gray-800"
|
||||
style="display: {{ $isOpen ? 'block' : 'none' }}"
|
||||
wire:key="auth-menu"
|
||||
wire:click.away="close"
|
||||
role="menu"
|
||||
aria-orientation="vertical"
|
||||
aria-labelledby="auth-menu-button"
|
||||
class="absolute right-0 z-50 w-56 mt-2 overflow-hidden transition-all duration-200 transform origin-top-right bg-gray-900/95 backdrop-blur-lg rounded-lg shadow-xl border border-gray-800/50 {{ $isOpen ? 'scale-100 opacity-100' : 'scale-95 opacity-0 pointer-events-none' }}"
|
||||
>
|
||||
<div
|
||||
hx-get="{{ route('login') }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend"
|
||||
class="cursor-pointer menu-item"
|
||||
<a
|
||||
href="{{ route('login') }}"
|
||||
role="menuitem"
|
||||
class="flex items-center w-full gap-3 px-4 py-3 text-gray-300 transition-colors hover:text-white hover:bg-gray-800/50 focus:outline-none focus:text-white focus:bg-gray-800/50"
|
||||
>
|
||||
<i class="w-5 fas fa-sign-in-alt"></i>
|
||||
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15 3h4a2 2 0 012 2v14a2 2 0 01-2 2h-4M10 17l5-5-5-5M15 12H3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
<span>Login</span>
|
||||
</div>
|
||||
<div
|
||||
hx-get="{{ route('register') }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend"
|
||||
class="cursor-pointer menu-item"
|
||||
</a>
|
||||
<a
|
||||
href="{{ route('register') }}"
|
||||
role="menuitem"
|
||||
class="flex items-center w-full gap-3 px-4 py-3 text-gray-300 transition-colors hover:text-white hover:bg-gray-800/50 focus:outline-none focus:text-white focus:bg-gray-800/50"
|
||||
>
|
||||
<i class="w-5 fas fa-user-plus"></i>
|
||||
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16 21v-2a4 4 0 00-4-4H6a4 4 0 00-4 4v2M12 11a4 4 0 100-8 4 4 0 000 8zM20 8v6M23 11h-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
<span>Register</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user