fix: clases arbitrarias de Tailwind con valores de runtime

Al dejar el CDN quedaron muertas todas las clases del tipo bg-[{{ $var }}]:
el JIT del navegador las resolvía en caliente, pero el build solo ve el
literal con la expresión Blade dentro y no genera ninguna regla. No falla
el build, simplemente el estilo desaparece.

El caso visible era el modal de "ver promoción": bg-[url({{ asset(...) }})]
dejaba un bloque blanco de 16rem donde debía ir la imagen.

Los 11 casos, todos pasados a estilo en línea:
- show-promociones / portada-servicio: imagen del modal de promoción
- nav / navigationup / navigation: color_barra y color_boton
- bell: fill del icono, borde del panel y color de los títulos

En nav.blade.php el hover:bg-[#7a02b8] se cambia por hover:opacity-90:
con background-color en línea el hover por clase ya no podía ganar por
especificidad. Es el mismo patrón que ya usaba navigationup.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro
2026-08-01 22:34:00 +00:00
co-authored by Claude Sonnet 4.6
parent 84367f2e23
commit 203c0808a1
9 changed files with 19 additions and 14 deletions
+3 -3
View File
@@ -1,5 +1,5 @@
<div class="flex justify-center items-center" x-data="{ menuNotificaciones: @entangle('menuNotificaciones') }">
<div class="fill-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }}] relative cursor-pointer" wire:click="$refresh" @click="menuNotificaciones=!menuNotificaciones">
<div class="relative cursor-pointer" style="fill: {{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }};" wire:click="$refresh" @click="menuNotificaciones=!menuNotificaciones">
@if ($numNoti != 0)
<span class="absolute top-0 left-0 bg-red-500 rounded-full w-5 h-5 flex justify-center items-center text-xs text-white">
{{ $numNoti > 9 ? '9+' : $numNoti }}
@@ -10,11 +10,11 @@
</svg>
</div>
<div x-cloak x-show="menuNotificaciones" @click.outside="menuNotificaciones = false" class="absolute top-14 right-2 md:right-32 rounded-lg border overflow-y-auto border-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }}] bg-white w-72 md:w-96 h-96 z-50">
<div x-cloak x-show="menuNotificaciones" @click.outside="menuNotificaciones = false" class="absolute top-14 right-2 md:right-32 rounded-lg border overflow-y-auto bg-white w-72 md:w-96 h-96 z-50" style="border-color: {{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }};">
<ul class="p-4">
@forelse ($consulta as $item)
<li class="px-2 py-1 mb-2 border border-gray-300 rounded-lg relative" wire:loading.class="opacity-50 cursor-wait">
<h4 class="font-bold text-base text-[{{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }}]">
<h4 class="font-bold text-base" style="color: {{ App\Models\Configuracione::Orderby('id', 'desc')->first()->color_boton }};">
{{ $item->titulo }}
</h4>
<p class="text-sm">