From bb447bb02a7568d0e143943aa494cef0244492b6 Mon Sep 17 00:00:00 2001
From: Ali <83188384+testA113@users.noreply.github.com>
Date: Wed, 27 Jul 2022 14:11:54 +1200
Subject: [PATCH] fix(ui): remove unwanted icon hover fill EE-3737 (#7284)

---
 app/react/components/datatables/TableHeaderCell.module.css | 2 +-
 app/react/components/datatables/TableHeaderCell.tsx        | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/react/components/datatables/TableHeaderCell.module.css b/app/react/components/datatables/TableHeaderCell.module.css
index 382fddb3b..188d15ed6 100644
--- a/app/react/components/datatables/TableHeaderCell.module.css
+++ b/app/react/components/datatables/TableHeaderCell.module.css
@@ -1,4 +1,4 @@
 /* highlight the sort icons for columns that aren't actively sorting */
-button:not(.sortingActive):hover path {
+.sortable:not(.sortingActive):hover path {
   fill: var(--sort-icon-hover);
 }
diff --git a/app/react/components/datatables/TableHeaderCell.tsx b/app/react/components/datatables/TableHeaderCell.tsx
index f9280ccaf..822447243 100644
--- a/app/react/components/datatables/TableHeaderCell.tsx
+++ b/app/react/components/datatables/TableHeaderCell.tsx
@@ -69,7 +69,8 @@ function SortWrapper({
       type="button"
       onClick={() => onClick(!isSortedDesc)}
       className={clsx(
-        'sortable !bg-transparent w-full h-full !ml-0 !px-0 border-none focus:border-none',
+        '!bg-transparent w-full h-full !ml-0 !px-0 border-none focus:border-none',
+        styles.sortable,
         isSorted && styles.sortingActive
       )}
     >