usite-sas-bic/sirpremiumv2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor navigation layout for improved structure

Browse Source 
Reorganized the navigation sidebar to use a flex column layout and moved the menu and user info into a scrollable container. Improved sticky header behavior, added a logout button at the bottom, and fixed minor styling issues for better usability and maintainability.
This commit is contained in:
Juan Felipe Duarte
2025-09-23 09:48:02 -05:00
parent 9b9ada492a
commit 35b4f51aee
1 changed files with 225 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/layouts/navigation.blade.php
+12 -7
View File
@@ -4,25 +4,26 @@
$bg = $config->color_barra ?? '#0000ff';
@endphp
<aside x-cloak :class="openAside ? 'translate-x-0' : '-translate-x-full'" class="z-20 fixed inset-y-0 left-0 w-64 transform transition-transform duration-300 ease-in-out h-screen overflow-y-auto shadow-lg" style="background: {{ $bg }};">
<div class="flex items-center justify-between px-4 py-3 text-white border-b border-white/20">
<div>
<aside x-cloak :class="openAside ? 'translate-x-0' : '-translate-x-full'" class="z-20 fixed inset-y-0 left-0 w-64 transform transition-transform duration-300 ease-in-out min-h-screen shadow-lg flex flex-col" style="background: {{ $bg }};">
<div class="flex items-center justify-between px-4 py-3 text-white border-b border-white/20 sticky top-0 bg-[{{ $bg }}] z-30">
<div class="w-20">
<x-application-logo />
</div>
<button @click="openAside = !openAside" class="p-2 rounded-md text-white hover:bg-blue-900 focus:outline-none cursor-pointer">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
<button @click="openAside = !openAside"
class="p-2 rounded-md text-white hover:bg-blue-900 focus:outline-none cursor-pointer">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none"
viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="flex-1 overflow-y-auto select-none">
<div class="text-center py-4 ms:py-6">
<div class="font-medium text-base text-white">{{ Auth::user()->name ?? ''}}</div>
<div class="font-medium text-sm text-gray-500">{{ Auth::user()->email ?? ''}}</div>
<div class="font-semibold text-sm text-gray-500 capitalize">{{ Auth::user()->rol->nombre ?? ''}}</div>
</div>
<!-- Items del menú -->
<nav class="px-4 mt-2 space-y-2 pb-4">
<a href="{{ route('dashboard') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('dashboard') ? 'bg-white/20' : 'hover:bg-white/10' }}">
@@ -234,6 +235,10 @@
</button>
</form>
</nav>
</div>
</div>
</aside>