[BUG] - Table Component doesn't change background color

[SergioRBJ]

NextUI Version

2.3.6

Describe the bug

When using Table component, we can't update the background color using property className inside Table.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. crate a Table using Table component.
2. Try to change background color.

Expected behavior

As a developer, I need to update background color of the Table.

Screenshots or Videos

![Uploading image.png…]()

Operating System Version

Linux

Browser

Chrome

[linear[bot]]

ENG-907 [BUG] - Table Component doesn't change background color

[wingkwong]

You screenshot is not visible. Please fix the link. Also please share some code to show how you change the background color.

[SergioRBJ]

In order to change bg color, I need to do some things:

• add removeWrapper property, because this makes the background white.
• add border-collapse tailwind property, for remove border.

Here is my updated code:

<Table
  aria-label="Rows actions table example with dynamic content"
  selectionMode="none"
  removeWrapper
  className="bg-slate-700 rounded-lg border-collapse"
>
  <TableHeader columns={columns}>
    {(column) => (
      <TableColumn
        key={column.key}
        className="bg-slate-700 text-md text-question text-center font-normal"
      >
        {column.label}
      </TableColumn>
    )}
  </TableHeader>
  <TableBody items={rows}>
    {(item) => (
      <TableRow
        key={item.key}
        className="text-center bg-slate-300 rounded-full border-collapse"
      >
        {(columnKey) => (
          <TableCell className="text-center text-slate-800">
            {getKeyValue(item, columnKey)}
          </TableCell>
        )}
      </TableRow>
    )}
  </TableBody>
</Table>

Also, the bottom border is not rounded.