refactor(grid): sorting indicator is now using the header text color when the column header is selected, this change make sure that it will be visible no mater the background color.

Author: desig9stein

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss

@@ -1661,8 +1661,23 @@
         background: var-get($theme, 'header-selected-background');
         opacity: if($variant != 'indigo-design', .7, 1);
 
-        .sort-icon::after {
-            background: var-get($theme, 'header-selected-background');
+        .sort-icon {
+            color: var-get($theme, 'header-selected-text-color');
+
+            ::after {
+                background: var-get($theme, 'header-selected-background');
+            }
+        }
+
+        &%igx-grid-th--sorted {
+            .sort-icon {
+                color: var-get($theme, 'header-selected-text-color');
+
+                &:focus,
+                &:hover {
+                    color: var-get($theme, 'header-selected-text-color');
+                }
+            }
         }
     }
 
@@ -1673,6 +1688,17 @@
         .sort-icon::after {
             background: var-get($theme, 'header-selected-background');
         }
+
+        &%igx-grid-th--sorted {
+            .sort-icon {
+                color: var-get($theme, 'header-selected-text-color');
+
+                &:focus,
+                &:hover {
+                    color: var-get($theme, 'header-selected-text-color');
+                }
+            }
+        }
     }
 
     %igx-grid-th--active {

projects/igniteui-angular/src/lib/core/styles/themes/schemas/dark/_grid.scss

@@ -36,14 +36,6 @@
 /// @prop {Map} root-summaries-background [igx-color: ('grays', 200)] - The background color of the summary groups located the footer.
 /// @prop {Map} root-summaries-text-color [igx-contrast-color: ('grays', 200)] - The text color of the summary groups located the footer.
 $base-dark-grid: (
-    sortable-header-icon-hover-color: (
-        igx-color: ('secondary', 100)
-    ),
-
-    sorted-header-icon-color: (
-        igx-contrast-color: ('secondary', 600)
-    ),
-
     content-background: (
         igx-color: 'surface',
     ),