update separator color on resize

mui · Sep 4, 2024 · 1b18a02 · KenanYusuf · Sep 4, 2024 · 1b18a02
1 parent 04762e6
commit 1b18a02
Showing 1 changed file with 7 additions and 6 deletions.
diff --git a/packages/x-data-grid/src/components/containers/GridRootStyles.ts b/packages/x-data-grid/src/components/containers/GridRootStyles.ts
@@ -436,16 +436,17 @@ export const GridRootStyles = styled('div', {
     [`& .${c['columnSeparator--resizable']}`]: {
       cursor: 'col-resize',
       touchAction: 'none',
+      [`&.${c['columnSeparator--resizing']}`]: {
+        color: (t.vars || t).palette.primary.main,
+      },
       // Always appear as draggable on touch devices
       '@media (hover: none)': {
         [`& .${c.iconSeparator} rect`]: separatorIconDragStyles,
-        color: borderColor,
       },
-      [`&:hover, &.${c['columnSeparator--resizing']}`]: {
-        color: (t.vars || t).palette.primary.main,
-        [`& .${c.iconSeparator} rect`]: separatorIconDragStyles,
-        '@media (hover: none)': {
-          color: borderColor,
+      '@media (hover: hover)': {
+        '&:hover': {
+          color: (t.vars || t).palette.primary.main,
+          [`& .${c.iconSeparator} rect`]: separatorIconDragStyles,
         },
       },
       '& svg': {