Default styling

Example of a table with bootstrap default styling. By default any table with .table class has transparent background color.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}

Table header styling

Example of a custom table header styling. Table header supports default contextual and custom background colors change to use bootstrap class. Add .bg-* class to the header row. All border and text colors will be automatically adjusted.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}

Apart form bootstrap color options you can also use Modern Admin color palette options, To set the selected bg color lighten use .bg-* where * is the value of your selected color from palette, and with that use .bg-lighten-* or .bg-darken-* class where * is the value between '1-5' of your selected lighten/darken color from modern color palette. So for color lighten 4 bg class will be .bg-lighten-4.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}

Table footer styling

Example of a custom table footer styling. Table footer supports default contextual and custom background colors to use bootstrap class . Add .bg-* class to the header row. All border and text colors will be automatically adjusted.

{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}
Firstname Lastname Email Password

Apart form bootstrap color options you can also use Modern Admin color palette options, To set the selected bg color lighten use .bg-* where * is the value of your selected color from palette, and with that use .bg-lighten-* or .bg-darken-* class where * is the value between '1-5' of your selected lighten/darken color from modern color palette. So for color lighten 4 bg class will be .bg-lighten-4.

{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}
Firstname Lastname Email Password

Custom table formatting

Example of a table with custom formatting color.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{country.password}}

Header and footer formatting

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}
Firstname Lastname Email Password

Modern Admin color palette options can be use also for the custom table formatting, To set the selected bg color lighten use .bg-* where * is the value of your selected color from palette, and with that use .bg-lighten-* or .bg-darken-* class where * is the value between '1-5' of your selected lighten/darken color from modern color palette. So for color lighten 4 bg class will be .bg-lighten-4.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}

Header and footer formatting

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}
Firstname Lastname Email Password

Table formatting options

Table with custom formatting color supports all default table layouts and options. In this example our table displays all possible borders, striped rows and changes background color on row hover.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}

Modern Admin color palette options can be use also for the custom table formatting, To set the selected bg color lighten use .bg-* where * is the value of your selected color from palette, and with that use .bg-lighten-* or .bg-darken-* class where * is the value between '1-5' of your selected lighten/darken color from modern color palette. So for color lighten 4 bg class will be .bg-lighten-4.

Firstname Lastname Email Password
{{ country.firstname }} {{ country.lastname }} {{ country.email }} {{ country.password }}