From adcce89f42ba1ff46a2e19a9b04d2a3cf59678fe Mon Sep 17 00:00:00 2001
From: josedario87 <71241187+josedario87@users.noreply.github.com>
Date: Tue, 3 Jun 2025 14:21:27 -0600
Subject: [PATCH] Fix row hover color in NucleoTable

---
 ui/src/components/ui/NucleoTable.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/ui/NucleoTable.vue b/ui/src/components/ui/NucleoTable.vue
index f542c3f..f5d2190 100644
--- a/ui/src/components/ui/NucleoTable.vue
+++ b/ui/src/components/ui/NucleoTable.vue
@@ -20,8 +20,8 @@
         <tr
           v-for="(item, index) in items"
           :key="item.id || index"
-          class="transition-colors duration-150 ease-in-out"
-          :class="[`hover:bg-[var(${props.accentColor})]/10 dark:hover:bg-[var(${props.accentColor})]/20`]"
+          class="transition-colors duration-150 ease-in-out hover:bg-[var(--row-hover-color)]/10 dark:hover:bg-[var(--row-hover-color)]/20"
+          :style="{ '--row-hover-color': `var(${props.accentColor})` }"
         >
           <td v-for="column in columns" :key="column.key" class="px-4 py-3 sm:px-6 sm:py-4 whitespace-nowrap text-sm text-gray-700 dark:text-slate-300">
             <slot :name="`cell-${column.key}`" :item="item" :index="index">