remove after styles if not applied

KevinVandy · Jan 26, 2024 · f522f60 · f522f60 · vercel · Jan 26, 2024
1 parent ebfb5f5
commit f522f60
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 11 deletions.
diff --git a/apps/material-react-table-docs/styles/globals.css b/apps/material-react-table-docs/styles/globals.css
@@ -1,5 +1,5 @@
+html,
 body {
-  background-color: #111;
   padding: 0;
   margin: 0;
   font-family:
@@ -21,6 +21,10 @@ body {
   overflow-x: hidden;
 }
 
+body {
+  background-color: #111;
+}
+
 a {
   color: inherit;
   text-decoration: none;

diff --git a/packages/material-react-table/src/components/body/MRT_TableBodyRow.tsx b/packages/material-react-table/src/components/body/MRT_TableBodyRow.tsx
@@ -176,12 +176,12 @@ export const MRT_TableBodyRow = <TData extends MRT_RowData>({
           ...tableRowProps?.style,
         }}
         sx={(theme: Theme) => ({
-          '&:hover td:after': {
-            backgroundColor: cellHighlightColorHover
-              ? alpha(cellHighlightColorHover, 0.3)
-              : undefined,
-            ...commonCellBeforeAfterStyles,
-          },
+          '&:hover td:after': cellHighlightColorHover
+            ? {
+                backgroundColor: alpha(cellHighlightColorHover, 0.3),
+                ...commonCellBeforeAfterStyles,
+              }
+            : undefined,
           backgroundColor: `${baseBackgroundColor} !important`,
           bottom:
             !virtualRow && bottomPinnedIndex !== undefined && isRowPinned
@@ -199,12 +199,14 @@ export const MRT_TableBodyRow = <TData extends MRT_RowData>({
               ? 'sticky'
               : 'relative',
           td: {
-            '&:after': {
-              backgroundColor: cellHighlightColor,
-              ...commonCellBeforeAfterStyles,
-            },
             ...getCommonPinnedCellStyles({ table, theme }),
           },
+          'td:after': cellHighlightColor
+            ? {
+                backgroundColor: cellHighlightColor,
+                ...commonCellBeforeAfterStyles,
+              }
+            : undefined,
           top: virtualRow
             ? 0
             : topPinnedIndex !== undefined && isRowPinned