Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Doc] Added missing Datagrid css rules #5522

Merged
merged 1 commit into from
Nov 12, 2020
Merged

[Doc] Added missing Datagrid css rules #5522

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 17 additions & 9 deletions docs/List.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2034,15 +2034,23 @@ export const PostList = props => (

The `Datagrid` component accepts the usual `className` prop but you can override many class names injected to the inner components by React-admin thanks to the `classes` property (as most Material UI components, see their [documentation about it](https://material-ui.com/customization/components/#overriding-styles-with-classes)). This property accepts the following keys:

| Rule name | Description |
| ------------- | ------------------------------------------------------------- |
| `table` | Alternative to using `className`. Applied to the root element |
| `tbody` | Applied to the tbody |
| `headerCell` | Applied to each header cell |
| `row` | Applied to each row |
| `rowEven` | Applied to each even row |
| `rowOdd` | Applied to the each odd row |
| `rowCell` | Applied to the each row cell |
| Rule name | Description |
| ---------------- | ------------------------------------------------------------- |
| `table` | Alternative to using `className`. Applied to the root element |
| `thead` | Applied to the header of the `Datagrid` |
| `tbody` | Applied to the tbody |
| `headerCell` | Applied to each header cell |
| `headerRow` | Applied to each header row |
| `row` | Applied to each row |
| `rowEven` | Applied to each even row |
| `rowOdd` | Applied to each odd row |
| `rowCell` | Applied to each row cell |
| `expandHeader` | Applied to each expandable header cell |
| `clickableRow` | Applied to each row if `rowClick` prop is truthy |
| `expandIconCell` | Applied to each expandable cell |
| `expandIcon` | Applied to each expand icon |
| `expanded` | Applied to each expanded icon |
| `checkbox` | Applied to each checkbox cell |

You can customize the `<Datagrid>` styles by passing a `classes` object as prop, through `useStyles()`. Here is an example:

Expand Down