naser
/
libra
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

move the user from the side bar to the top of the page and adjusted colors

This commit is contained in:
Naser Mansour 2026-01-09 16:16:29 +02:00
parent a921f7b087
commit 944076e0bf
1 changed files with 56 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
resources/views/components/layouts/app/sidebar.blade.php
View File

@ -195,52 +195,6 @@
<div class="px-3 py-2">
<x-language-toggle variant="light" />
</div>
<!-- Desktop User Menu -->
<flux:dropdown class="hidden lg:block" position="bottom" align="start">
<flux:profile
:name="auth()->user()->full_name"
:initials="auth()->user()->initials()"
icon:trailing="chevrons-up-down"
data-test="sidebar-menu-button"
/>
<flux:menu class="w-[220px]">
<flux:menu.radio.group>
<div class="p-0 text-sm font-normal">
<div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
<span class="relative flex h-8 w-8 shrink-0 overflow-hidden rounded-lg">
<span
class="flex h-full w-full items-center justify-center rounded-lg bg-neutral-200 text-black"
>
{{ auth()->user()->initials() }}
</span>
</span>
<div class="grid flex-1 text-start text-sm leading-tight">
<span class="truncate font-semibold">{{ auth()->user()->full_name }}</span>
<span class="truncate text-xs">{{ auth()->user()->email }}</span>
</div>
</div>
</div>
</flux:menu.radio.group>
<flux:menu.separator />
<flux:menu.radio.group>
<flux:menu.item :href="route('profile.edit')" icon="cog" wire:navigate>{{ __('Settings') }}</flux:menu.item>
</flux:menu.radio.group>
<flux:menu.separator />
<form method="POST" action="{{ route('logout') }}" class="w-full">
@csrf
<flux:menu.item as="button" type="submit" icon="arrow-right-start-on-rectangle" class="w-full" data-test="logout-button">
{{ __('Log Out') }}
</flux:menu.item>
</form>
</flux:menu>
</flux:dropdown>
</flux:sidebar>
<!-- Mobile User Menu -->
@ -274,7 +228,11 @@
<flux:profile
:initials="auth()->user()->initials()"
icon-trailing="chevron-down"
/>
>
<x-slot name="avatar">
<flux:avatar class="bg-white text-zinc-700 ring-1 ring-zinc-200" :initials="auth()->user()->initials()" />
</x-slot>
</flux:profile>
<flux:menu>
<flux:menu.radio.group>
@ -282,7 +240,7 @@
<div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
<span class="relative flex h-8 w-8 shrink-0 overflow-hidden rounded-lg">
<span
class="flex h-full w-full items-center justify-center rounded-lg bg-neutral-200 text-black"
class="flex h-full w-full items-center justify-center rounded-lg bg-white text-zinc-700 ring-1 ring-zinc-200"
>
{{ auth()->user()->initials() }}
</span>
@ -333,6 +291,56 @@
@endif
</a>
@endif
<!-- Desktop User Menu -->
<flux:dropdown position="bottom" align="end">
<flux:profile
:name="auth()->user()->full_name"
:initials="auth()->user()->initials()"
icon:trailing="chevron-down"
data-test="sidebar-menu-button"
>
<x-slot name="avatar">
<flux:avatar class="bg-white text-zinc-700 ring-1 ring-zinc-200" :initials="auth()->user()->initials()" />
</x-slot>
</flux:profile>
<flux:menu class="w-[220px]">
<flux:menu.radio.group>
<div class="p-0 text-sm font-normal">
<div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
<span class="relative flex h-8 w-8 shrink-0 overflow-hidden rounded-lg">
<span
class="flex h-full w-full items-center justify-center rounded-lg bg-white text-zinc-700 ring-1 ring-zinc-200"
>
{{ auth()->user()->initials() }}
</span>
</span>
<div class="grid flex-1 text-start text-sm leading-tight">
<span class="truncate font-semibold">{{ auth()->user()->full_name }}</span>
<span class="truncate text-xs">{{ auth()->user()->email }}</span>
</div>
</div>
</div>
</flux:menu.radio.group>
<flux:menu.separator />
<flux:menu.radio.group>
<flux:menu.item :href="route('profile.edit')" icon="cog" wire:navigate>{{ __('Settings') }}</flux:menu.item>
</flux:menu.radio.group>
<flux:menu.separator />
<form method="POST" action="{{ route('logout') }}" class="w-full">
@csrf
<flux:menu.item as="button" type="submit" icon="arrow-right-start-on-rectangle" class="w-full" data-test="logout-button">
{{ __('Log Out') }}
</flux:menu.item>
</form>
</flux:menu>
</flux:dropdown>
</div>
<div class="lg:pt-14">