From 944076e0bf4893d4d08a395a93d6a9ae0bd5744f Mon Sep 17 00:00:00 2001
From: Naser Mansour <naser@aumix.com>
Date: Fri, 9 Jan 2026 16:16:29 +0200
Subject: [PATCH] move the user from the side bar to the top of the page and
 adjusted colors

---
 .../components/layouts/app/sidebar.blade.php  | 104 ++++++++++--------
 1 file changed, 56 insertions(+), 48 deletions(-)

diff --git a/resources/views/components/layouts/app/sidebar.blade.php b/resources/views/components/layouts/app/sidebar.blade.php
index a5d998e..7b293b7 100644
--- a/resources/views/components/layouts/app/sidebar.blade.php
+++ b/resources/views/components/layouts/app/sidebar.blade.php
@@ -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">