Tables — TheAdmin

Basic styling

Since Theadmin is based on Bootstrap, so you can safley use Bootstrap's table classes to style your table. We also added more table styles and functionality to our framework.

Basic

All tables need .tableclass.

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Alternativethead

.thead-defaultapplies to thead

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Striped

.table-stripedapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Bordered

.table-borderedapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Hover

.table-hoverapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Separated

.table-separatedapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Smalltable

.table-smapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Largetable

.table-lgapplies to .table

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Responsivetables

Create responsive tables by adding .table-responsiveto any .tableto make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

#	Table heading	Table heading	Table heading	Table heading	Table heading	Table heading
1	Table cell	Table cell	Table cell	Table cell	Table cell	Table cell
2	Table cell	Table cell	Table cell	Table cell	Table cell	Table cell
3	Table cell	Table cell	Table cell	Table cell	Table cell	Table cell

Advanced tables

Selectallrows

data-provide="checkall"applies to .tablefor check all checkboxes.

First Name	Last Name	Username
Mark	Otto	@mdo
Jacob	Thornton	@fat
Larry	the Bird	@twitter

Selectable

data-provide="selectable"applies to .table

First Name	Last Name	Username
Mark	Otto	@mdo
Jacob	Thornton	@fat
Larry	the Bird	@twitter

Using medias

#	User	Sales
1	Maryam Amiri Designer	541
2	Hossein Shams Designer	364
3	Sarah Conner Designer	840

Row actions

#	First Name	Last Name	Actions
1	Mark	Otto	Details Add file Performance
2	Jacob	Thornton	Details Add file Performance
3	Larry	the Bird	Details Add file Performance

Toolbar

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Pagination

#	First Name	Last Name	Username
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter