From 3b919ac8a9423084d525b5eead33e110a6a98bf9 Mon Sep 17 00:00:00 2001
From: Lizandro Guarnizo <77708265+lizandrogd@users.noreply.github.com>
Date: Sat, 18 Apr 2026 14:18:52 -0500
Subject: [PATCH] Update navigationup.blade.php

---
 .../views/layouts/navigationup.blade.php      | 116 +++++++++---------
 1 file changed, 58 insertions(+), 58 deletions(-)

diff --git a/resources/views/layouts/navigationup.blade.php b/resources/views/layouts/navigationup.blade.php
index 1c9c075..2d349dc 100755
--- a/resources/views/layouts/navigationup.blade.php
+++ b/resources/views/layouts/navigationup.blade.php
@@ -1,72 +1,72 @@
-<nav class="bg-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_barra }}] border-b border-gray-100 rounded-b-3xl shadow">
-    <!-- Primary Navigation Menu -->
-    <div class="md:w-[90%] mx-auto px-4 sm:px-2 lg:px-4 py-1">
-        <div class="flex items-center gap-4 md:gap-6 justify-between">
-            <div class="text-white">
-                <svg @click="openAside = true" class="cursor-pointer w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+@php
+    $config = App\Models\Configuracione::orderBy('id', 'desc')->first();
+@endphp
+<nav class="bg-[{{ $config->color_barra }}] border-b border-white/10 shadow-md">
+    <div class="md:w-[90%] mx-auto px-3 sm:px-4 lg:px-6">
+        <div class="flex items-center h-16 gap-2 sm:gap-3">
+
+            {{-- Hamburger --}}
+            <button @click="openAside = true" class="text-white p-1.5 rounded-lg hover:bg-white/10 transition-colors flex-shrink-0 cursor-pointer">
+                <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
                 </svg>
-            </div>
-            <div class="flex-1 flex justify-center md:justify-between h-16">
-                <div class="flex">
-                    <!-- Logo -->
-                    <div class="shrink-0 flex items-center">
-                        <a href="{{ route('dashboard') }}">
-                            <div class="block w-[4rem] fill-current text-gray-600 b border border-gray-500 rounded-full overflow-hidden">
-                                <x-application-logo />
-                            </div>
-                        </a>
-                    </div>
+            </button>
 
-                    <div
-                        class="space-x-8 ml-1 pr-1 sm:ml-8 sm:pr-4 flex text-white font-semibold items-center border-r border-gray-500 my-2">
-                        <div class=" text-sm md:text-xl ">
-                            {{ App\Models\Configuracione::Orderby('id', 'desc')->first()->nombre }}</div>
-                    </div>
-                    <div class="space-x-8 ml-1 sm:-my-px  sm:ml-4 flex text-white items-center my-2 align-middle">
-                        <div class=" text-sm md:text-xl hidden sm:block ">
-                            {{ App\Models\Configuracione::Orderby('id', 'desc')->first()->slogan }}</div>
-                    </div>
+            {{-- Logo --}}
+            <a href="{{ route('dashboard') }}" class="flex-shrink-0">
+                <div class="w-10 h-10 rounded-full overflow-hidden border-2 border-white/30">
+                    <x-application-logo />
                 </div>
+            </a>
 
+            {{-- Nombre + Slogan --}}
+            <div class="flex flex-col leading-tight overflow-hidden min-w-0">
+                <span class="text-white font-semibold text-sm md:text-base truncate">{{ $config->nombre }}</span>
+                <span class="text-white/60 text-xs hidden sm:block truncate">{{ $config->slogan }}</span>
+            </div>
 
+            {{-- Spacer --}}
+            <div class="flex-1"></div>
 
-                <div class="flex">
-                    <livewire:bell />
+            {{-- Campana --}}
+            <livewire:bell />
 
-                    <div class="space-x-8 sm:ml-8 sm:pr-4 flex text-white font-semibold items-center border-r border-gray-500/40 my-2 mx-1 pr-1">
-                        <livewire:saldo-header />
-                    </div>
+            {{-- Divisor --}}
+            <div class="h-7 w-px bg-white/20 flex-shrink-0"></div>
 
-                    @if (auth()->user()->rol->nombre != 'editor' && auth()->user()->rol->nombre != 'administrador')
-                        <div class="hidden sm:space-x-8 sm:-my-px sm:ml-6 md:flex text-white items-center">
-                            <a href="{{ route('recarga') }}" class=" text-sm sm:text-base  flex px-1 sm:px-4 py-2  rounded-lg bg-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }}] hover:bg-[#7a02b8]">Cargar
-                                saldo
-                                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-                                    version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512"
-                                    style="enable-background:new 0 0 512 512;" xml:space="preserve"
-                                    class="md:w-[0.87rem] w-[0.5rem] ml-1 sm:ml-2 ">
-                                    <path
-                                        d="M480,224H288V32c0-17.673-14.327-32-32-32s-32,14.327-32,32v192H32c-17.673,0-32,14.327-32,32s14.327,32,32,32h192v192   c0,17.673,14.327,32,32,32s32-14.327,32-32V288h192c17.673,0,32-14.327,32-32S497.673,224,480,224z"
-                                        fill="#ffffff" />
-                                </svg>
-                            </a>
-                        </div>
-                        <div class="md:hidden space-x-8 flex text-white items-center">
-                            <a href="{{ route('recarga') }}"
-                                class=" text-sm sm:text-base  flex px-1 sm:px-4 py-2  rounded-lg bg-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }}] hover:bg-[#7a02b8]">
-                                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-                                    version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512"
-                                    style="enable-background:new 0 0 512 512;" xml:space="preserve" class="w-[1rem]">
-                                    <path
-                                        d="M480,224H288V32c0-17.673-14.327-32-32-32s-32,14.327-32,32v192H32c-17.673,0-32,14.327-32,32s14.327,32,32,32h192v192   c0,17.673,14.327,32,32,32s32-14.327,32-32V288h192c17.673,0,32-14.327,32-32S497.673,224,480,224z"
-                                        fill="#ffffff" />
-                                </svg>
-                            </a>
-                        </div>
+            {{-- Ícono billetera + saldo --}}
+            <div class="flex items-center gap-1.5 text-white flex-shrink-0">
+                <svg class="w-4 h-4 text-white/60 flex-shrink-0 hidden sm:block" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M21 12a2.25 2.25 0 0 0-2.25-2.25H15a3 3 0 1 1-6 0H5.25A2.25 2.25 0 0 0 3 12m18 0v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6m18 0V9M3 12V9m18-3a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 0 3 9" />
+                </svg>
+                <livewire:saldo-header />
+            </div>
+
+            {{-- Botón Cargar saldo (oculto para editor/administrador) --}}
+            @if (!in_array(auth()->user()->rol->nombre, ['editor', 'administrador']))
+                <a href="{{ route('recarga') }}" class="flex-shrink-0 inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-white text-sm font-medium bg-[{{ $config->color_boton }}] hover:opacity-90 transition-opacity">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="w-3.5 h-3.5 fill-white flex-shrink-0">
+                        <path d="M480,224H288V32c0-17.673-14.327-32-32-32s-32,14.327-32,32v192H32c-17.673,0-32,14.327-32,32s14.327,32,32,32h192v192c0,17.673,14.327,32,32,32s32-14.327,32-32V288h192c17.673,0,32-14.327,32-32S497.673,224,480,224z"/>
+                    </svg>
+                    <span class="hidden sm:inline">Cargar saldo</span>
+                </a>
+            @endif
+
+            {{-- Divisor --}}
+            <div class="h-7 w-px bg-white/20 flex-shrink-0"></div>
+
+            {{-- Avatar + nombre del usuario --}}
+            <a href="{{ route('perfil') }}" class="flex items-center gap-2 text-white hover:bg-white/10 rounded-lg px-2 py-1 transition-colors flex-shrink-0">
+                <div class="w-8 h-8 rounded-full overflow-hidden border border-white/30 flex-shrink-0">
+                    @if (Auth::user()->img_perfil)
+                        <img src="{{ Auth::user()->img_perfil }}" alt="avatar" class="w-8 h-8 object-cover">
+                    @else
+                        <img src="https://ui-avatars.com/api/?name={{ urlencode(Auth::user()->name ?? 'U') }}&background=ffffff&color=6b21a8&size=64" alt="avatar" class="w-8 h-8 object-cover">
                     @endif
                 </div>
-            </div>
+                <span class="text-sm font-medium hidden md:block max-w-[110px] truncate">{{ Auth::user()->name }}</span>
+            </a>
+
         </div>
     </div>
 </nav>