Kuechlin / mantine-data-grid

mantine data grid
MIT License
176 stars 29 forks source link

Styles API - td not overriding / adding to style #125

Closed Shadowfita closed 1 year ago

Shadowfita commented 1 year ago

Description

Utilise styles API on datagrid to change TD padding td: { padding: "0px", },

Expected Behaviour

Padding on TD elements should be 0 pixels

Additional Information

<DataGrid fontSize="xs" highlightOnHover styles={{ // wrapper: { // transform: "scale(0.35)", // transformOrigin: "0 0", // }, headerCell: { width: "100%", }, headerCellContent: { textAlign: "center", width: "100%", }, dataCell: { width: "100%", }, dataCellContent: { whiteSpace: "unset", overflow: "unset", // textAlign: "center" width: "100%", }, td: { padding: "0px", }, }} />

Kuechlin commented 1 year ago

Not all Table styles can be overridden, mantine Table itself has no styles api

for now your only option is to use !important rule.

   <DataGrid
      styles={() => ({
        td: {
          padding: '0px !important',
        },
      })}
    />