Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

table

v1.0.0arrow_drop_down
v1.0.0
STATUS
Passing
DOWNLOADS
158
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
9 months ago
SIZE
3 KB
Adds zebra-striping to any table row within the `<tbody>`.
1 contributor
Use table in your project ?
Copied
npm i @bit/react-bootstrap.react-bootstrap.table
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
React Native
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
toggle layout
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
chevron_left
chevron_right

Adds zebra-striping to any table row within the <tbody>.

Adds borders on all sides of the table and cells.

Removes all borders on the table and cells, including table header.

Enable a hover state on table rows within a <tbody>.

Make tables more compact by cutting cell padding in half by setting size as sm.

Invert the colors of the table — with light text on dark backgrounds by setting variant as dark.

Responsive tables allow tables to be scrolled horizontally with ease. Across every breakpoint, use responsive for horizontally scrolling tables. Responsive tables are wrapped automatically in a div. Use responsive="sm", responsive="md", responsive="lg", or responsive="xl" as needed to create responsive tables up to a particular breakpoint. From that breakpoint and up, the table will behave normally and not scroll horizontally.