From 01e35a2c0b7eba413d211a1a2796023145251dfd Mon Sep 17 00:00:00 2001 From: josedario87 Date: Thu, 30 Oct 2025 11:28:16 -0600 Subject: [PATCH] Fix: aplicar color correcto al icono en tabs activas/inactivas MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Cambiado de 'icon' a 'leadingIcon' (propiedad correcta de Nuxt UI) y agregados estados de color explícitos: - Tab activa: text-[#1b1209] (negro oscuro) - Tab inactiva: text-[var(--brand-text-muted)] (gris apagado) - Transición suave de colores con transition-colors duration-200 Esto asegura que el icono sea visible y cambie de color correctamente al seleccionar diferentes tabs. --- nuxt4-app/app/pages/metabase-debug.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/nuxt4-app/app/pages/metabase-debug.vue b/nuxt4-app/app/pages/metabase-debug.vue index 9f48978..59620e5 100644 --- a/nuxt4-app/app/pages/metabase-debug.vue +++ b/nuxt4-app/app/pages/metabase-debug.vue @@ -79,8 +79,7 @@ indicator: 'bg-[#c08040] z-10', trigger: 'relative data-[state=active]:text-[#1b1209] data-[state=active]:hover:text-black data-[state=inactive]:text-[var(--brand-text-muted)] data-[state=inactive]:bg-transparent data-[state=inactive]:hover:text-[var(--brand-text)] data-[state=inactive]:hover:bg-[#2a1f14]/50 focus-visible:ring-2 focus-visible:ring-[#c08040] transition-colors duration-200', label: 'font-medium text-sm relative z-20', - // @ts-expect-error - icon is a valid customization prop in Nuxt UI - icon: 'relative z-20', + leadingIcon: 'relative z-20 data-[state=active]:text-[#1b1209] data-[state=inactive]:text-[var(--brand-text-muted)] transition-colors duration-200', content: 'py-4' }" >