mantine-react-table icon indicating copy to clipboard operation
mantine-react-table copied to clipboard

Bottom toolbar custom actions introduce padding (that probably should not be there)

Open dvmoritzschoefl opened this issue 1 year ago • 0 comments

mantine-react-table version

1.0.0

react & react-dom versions

18

Describe the bug and the steps to reproduce it

  1. Override 'renderBottomToolbarCustomActions'
  2. Add any custom action (for example a button)
  3. The container for both the action and the pagination now has a padding, which is correct I think
  4. However the pagination still has its old padding and therefore the total row height is now larger than before

Temporary I could fix this with

mantineBottomToolbarProps: { sx: { '> div': { paddingTop: 0, paddingBottom: 0, }, }, },

The screenshot shows the behavior. The total space above the pagination is larger with a custom action than without one

Minimal, Reproducible Example - (Optional, but Recommended)

enablePagination: true,
enableBottomToolbar: true,
renderBottomToolbarCustomActions: () => {
    return <div>content</div>
}

Screenshots or Videos (Optional)

image

Do you intend to try to help solve this bug with your own PR?

No, because I do not know how

Terms

  • [X] I understand that if my bug cannot be reliably reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

dvmoritzschoefl avatar Jul 20 '23 10:07 dvmoritzschoefl