From 4837de126260e611264987d1d57c41225375832b Mon Sep 17 00:00:00 2001 From: josedario87 Date: Thu, 30 Oct 2025 13:30:42 -0600 Subject: [PATCH] Style: Personalizar borde de focus con colores de la app MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Cambios aplicados: - Reemplazar ring-2 (2px) por ring-1 (1px) para borde más delgado - Cambiar color de focus de verde por defecto a --brand-primary (#e0c080) - Aplicar focus:ring-1 y focus:border-[--brand-primary] en el input base - Agregar focus-within:ring-1 en el root para consistencia - Agregar transition-shadow para animación suave del borde Ahora el borde de focus es más delgado y usa el color dorado de la app en lugar del verde por defecto de Nuxt UI. --- nuxt4-app/app/components/ClienteMultiSelector.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/nuxt4-app/app/components/ClienteMultiSelector.vue b/nuxt4-app/app/components/ClienteMultiSelector.vue index affebb8..cadacf5 100644 --- a/nuxt4-app/app/components/ClienteMultiSelector.vue +++ b/nuxt4-app/app/components/ClienteMultiSelector.vue @@ -13,7 +13,8 @@ size="sm" ignore-filter :ui="{ - base: 'bg-[var(--brand-surface)] text-[var(--brand-text)] border border-[var(--brand-border)]', + root: 'focus-within:ring-1 focus-within:ring-[var(--brand-primary)] transition-shadow', + base: 'bg-[var(--brand-surface)] text-[var(--brand-text)] border border-[var(--brand-border)] focus:ring-1 focus:ring-[var(--brand-primary)] focus:border-[var(--brand-primary)]', placeholder: 'placeholder-[var(--brand-text-muted)]', leadingIcon: 'text-[var(--brand-text-muted)]', content: 'bg-[var(--brand-surface)] border border-[var(--brand-border)]',