Use style props for padding

KevinVandy · Dec 8, 2023 · cacdb5e · cacdb5e
1 parent 9b01736
commit cacdb5e
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 7 deletions.
diff --git a/packages/mantine-react-table/src/body/MRT_TableDetailPanel.module.css b/packages/mantine-react-table/src/body/MRT_TableDetailPanel.module.css
@@ -25,12 +25,7 @@
 }
 
 .inner-expanded {
-  padding: 16px !important;
-  border-bottom: rem(1px) solid var(--_table-border-color) !important;
-}
-
-.inner-collapsed {
-  padding: 0 !important;
+  border-bottom: rem(1px) solid var(--_table-border-color);
 }
 
 .inner-virtual {

diff --git a/packages/mantine-react-table/src/body/MRT_TableDetailPanel.tsx b/packages/mantine-react-table/src/body/MRT_TableDetailPanel.tsx
@@ -83,9 +83,10 @@ export const MRT_TableDetailPanel = <TData extends Record<string, any> = {}>({
           'mantine-Table-td-detail-panel',
           classes.inner,
           layoutMode?.startsWith('grid') && classes['inner-grid'],
-          row.getIsExpanded() ? classes['inner-expanded'] : classes['inner-collapsed'],
+          row.getIsExpanded() && classes['inner-expanded'],
           virtualRow && classes['inner-virtual'],
         )}
+        p={row.getIsExpanded() ? "md" : 0}
       >
         {renderDetailPanel && (
           <Collapse in={row.getIsExpanded()}>