Merge pull request #8995 from marmelab/fix-list-children-css-class

Fix ListView does not apply CSS classes to its child components
marmelab · Jun 12, 2023 · 955b1bb · 955b1bb
2 parents 39a517e + d86cf55
commit 955b1bb
Showing 1 changed file with 5 additions and 8 deletions.
diff --git a/packages/ra-ui-materialui/src/list/ListView.tsx b/packages/ra-ui-materialui/src/list/ListView.tsx
@@ -54,6 +54,7 @@ export const ListView = <RecordType extends RaRecord = any>(
         <div className={ListClasses.main}>
             {(filters || actions) && (
                 <ListToolbar
+                    className={ListClasses.actions}
                     filters={filters}
                     actions={actions}
                     hasCreate={hasCreate}
@@ -78,7 +79,8 @@ export const ListView = <RecordType extends RaRecord = any>(
     );
 
     const renderEmpty = () =>
-        empty !== false && cloneElement(empty, { hasCreate });
+        empty !== false &&
+        cloneElement(empty, { className: ListClasses.noResults, hasCreate });
 
     const shouldRenderEmptyPage =
         !isLoading &&
@@ -163,12 +165,7 @@ const Root = styled('div', {
         overflow: 'inherit',
     },
 
-    [`& .${ListClasses.actions}`]: {
-        zIndex: 2,
-        display: 'flex',
-        justifyContent: 'flex-end',
-        flexWrap: 'wrap',
-    },
+    [`& .${ListClasses.actions}`]: {},
 
-    [`& .${ListClasses.noResults}`]: { padding: 20 },
+    [`& .${ListClasses.noResults}`]: {},
 }));