jeremy bayseandClaude Sonnet 5
6a776b0042
The top nav (logo + hamburger) was still sm:hidden-only on its inner sections but the <nav> element itself had no breakpoint class, so it kept rendering as an empty-looking bar above the new bottom tab bar. Hide the whole element below sm and drop the now-dead hamburger/Alpine toggle and its responsive menu, since nothing renders it anymore. Account/settings links (Profile, Foyer, Catégories, Récurrences, Log Out) that used to live in that hamburger now live in a "Plus" slide-up sheet on the bottom tab bar. Logging out needed a real route since the sheet isn't a Livewire component and can't call the Volt navigation component's method directly. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
106 lines
5.0 KiB
PHP
106 lines
5.0 KiB
PHP
<?php
|
|
|
|
use App\Livewire\Actions\Logout;
|
|
use Livewire\Volt\Component;
|
|
|
|
new class extends Component
|
|
{
|
|
/**
|
|
* Log the current user out of the application.
|
|
*/
|
|
public function logout(Logout $logout): void
|
|
{
|
|
$logout();
|
|
|
|
$this->redirect('/', navigate: true);
|
|
}
|
|
}; ?>
|
|
|
|
{{-- Hidden on mobile: primary routes live in the bottom tab bar, and
|
|
account/settings links live in its "Plus" panel — see bottom-tab-bar. --}}
|
|
<nav class="hidden sm:block bg-surface rounded-full shadow-sm">
|
|
<!-- Primary Navigation Menu -->
|
|
<div class="px-2.5 py-2">
|
|
<div class="flex justify-between items-center">
|
|
<div class="flex items-center">
|
|
<!-- Logo -->
|
|
<div class="shrink-0 flex items-center gap-2.5 mr-2">
|
|
<a href="{{ route('dashboard') }}" wire:navigate aria-label="{{ config('app.name', 'Laravel') }} — Tableau de bord" class="flex items-center gap-2.5 rounded-full focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface">
|
|
<span class="w-9 h-9 rounded-full bg-brand flex items-center justify-center shrink-0">
|
|
<x-application-logo class="block h-5 w-auto text-surface" />
|
|
</span>
|
|
<span class="font-display text-lg text-text">{{ config('app.name', 'SuiviCPT') }}</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Navigation Links -->
|
|
<div class="flex items-center gap-1">
|
|
<x-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')" wire:navigate>
|
|
{{ __('Tableau de bord') }}
|
|
</x-nav-link>
|
|
@if (Route::has('plan'))
|
|
<x-nav-link :href="route('plan')" :active="request()->routeIs('plan')" wire:navigate>
|
|
{{ __('Plan') }}
|
|
</x-nav-link>
|
|
@endif
|
|
@if (Route::has('suivi'))
|
|
<x-nav-link :href="route('suivi')" :active="request()->routeIs('suivi')" wire:navigate>
|
|
{{ __('Suivi') }}
|
|
</x-nav-link>
|
|
@endif
|
|
@if (Route::has('sankey'))
|
|
<x-nav-link :href="route('sankey')" :active="request()->routeIs('sankey')" wire:navigate>
|
|
{{ __('Flux') }}
|
|
</x-nav-link>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Settings Dropdown -->
|
|
<div class="flex items-center ms-6 gap-2">
|
|
<x-theme-toggle />
|
|
|
|
<x-dropdown align="right" width="48">
|
|
<x-slot name="trigger">
|
|
<button class="inline-flex items-center gap-2 pl-1 pr-3 py-1 rounded-full text-sm leading-4 font-medium text-text hover:bg-surface-alt focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface transition ease-in-out duration-150">
|
|
<span class="w-8 h-8 rounded-full bg-positive-fill text-surface flex items-center justify-center text-xs font-bold shrink-0">{{ Str::of(auth()->user()->name)->explode(' ')->map(fn ($p) => mb_substr($p, 0, 1))->take(2)->implode('') }}</span>
|
|
<div x-data="{{ json_encode(['name' => auth()->user()->name]) }}" x-text="name" x-on:profile-updated.window="name = $event.detail.name"></div>
|
|
|
|
<div class="text-text-muted text-[10px]">⌄</div>
|
|
</button>
|
|
</x-slot>
|
|
|
|
<x-slot name="content">
|
|
<x-dropdown-link :href="route('profile')" wire:navigate>
|
|
{{ __('Profile') }}
|
|
</x-dropdown-link>
|
|
|
|
<x-dropdown-link :href="route('household.settings')" wire:navigate>
|
|
{{ __('Foyer') }}
|
|
</x-dropdown-link>
|
|
|
|
@if (Route::has('categories'))
|
|
<x-dropdown-link :href="route('categories')" wire:navigate>
|
|
{{ __('Catégories') }}
|
|
</x-dropdown-link>
|
|
@endif
|
|
|
|
@if (Route::has('recurring'))
|
|
<x-dropdown-link :href="route('recurring')" wire:navigate>
|
|
{{ __('Récurrences') }}
|
|
</x-dropdown-link>
|
|
@endif
|
|
|
|
<!-- Authentication -->
|
|
<button wire:click="logout" class="w-full text-start">
|
|
<x-dropdown-link>
|
|
{{ __('Log Out') }}
|
|
</x-dropdown-link>
|
|
</button>
|
|
</x-slot>
|
|
</x-dropdown>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|