booking/assets/pug/pages/theme/bootstrap-sizing-table.pug
2025-03-24 22:58:00 +03:00

211 lines
9.8 KiB
Plaintext

- var theme_customizer = true;
doctype html
html(lang='en')
include ../../components/header-files
body
include ../../components/loader
// page-wrapper Start
#pageWrapper.page-wrapper
include ../../components/header
// Page Body Start
.page-body-wrapper.horizontal-menu
include ../../components/sidebar
.page-body
.container-fluid
.page-header
.row
.col-sm-6
h3
| Bootstrap Table Sizes
ol.breadcrumb
li.breadcrumb-item
a(href='index.html')
| Home
li.breadcrumb-item Tables
li.breadcrumb-item Bootstrap Tables
li.breadcrumb-item.active Sizing Tables
.col-sm-6
include ../../components/bookmark
// Container-fluid starts
.container-fluid
.row
.col-sm-12
.card
.card-header
h5 Extra Large Tables
span
| Example of Extra large table, Add
code .table-xl
| class to the
code .table
| to create a table with extra large spacing. Extra larger table all rows have
code 1.25rem
| height.
.table-responsive
table.table.table-xl
thead
tr
th #
th First Name
th Last Name
th Username
tbody
tr
th(scope='row') 1
td Mark
td Otto
td @mdo
tr
th(scope='row') 2
td Jacob
td Thornton
td @fat
tr
th(scope='row') 3
td Larry
td the Bird
td @twitter
.col-sm-12
.card
.card-header
h5 Large Table
span
| Example of large table, Add
code .table-lg
| class to the
code .table
| to create a table with large spacing. larger table all rows have
code 0.9rem
| height.
.table-responsive
table.table.table-lg
thead
tr
th(scope='col') #
th(scope='col') First
th(scope='col') Last
th(scope='col') Handle
tbody
tr
th(scope='row') 1
td Mark
td Otto
td @mdo
tr
th(scope='row') 2
td Jacob
td Thornton
td @fat
tr
th(scope='row') 3
td(colspan='2') Larry the Bird
td @twitter
.col-sm-12
.card
.card-header
h5 Default Table
span
| Example of large table, Add
code .table-de
| class to the
code .table
| to create a table with large spacing. larger table all rows have
code 0.75rem
| height.
.table-responsive
table.table.table-de
thead
tr
th(scope='col') #
th(scope='col') First
th(scope='col') Last
th(scope='col') Handle
tbody
tr
th(scope='row') 1
td Mark
td Otto
td @mdo
tr
th(scope='row') 2
td Jacob
td Thornton
td @fat
tr
th(scope='row') 3
td(colspan='2') Larry the Bird
td @twitter
.col-sm-12
.card
.card-header
h5 Small table
span
| Example of small table, Add
code .table-sm
| class to the
code .table
| to create a table with small spacing. Small table all rows have
code 0.3rem
| height
.table-responsive
table.table.table-sm
thead
tr
th(scope='col') #
th(scope='col') First
th(scope='col') Last
th(scope='col') Handle
tbody
tr
th(scope='row') 1
td Mark
td Otto
td @mdo
tr
th(scope='row') 2
td Jacob
td Thornton
td @fat
tr
th(scope='row') 3
td(colspan='2') Larry the Bird
td @twitter
.col-sm-12
.card
.card-header
h5 Extra Small table
span
| Example of small table, Add
code .table-xs
| class to the
code .table
| to create a table with extra small spacing. Small table all rows have
code 1.5rem
| height
.table-responsive
table.table.table-xs
thead
tr
th(scope='col') #
th(scope='col') First
th(scope='col') Last
th(scope='col') Handle
tbody
tr
th(scope='row') 1
td Mark
td Otto
td @mdo
tr
th(scope='row') 2
td Jacob
td Thornton
td @fat
tr
th(scope='row') 3
td(colspan='2') Larry the Bird
td @twitter
// Container-fluid Ends
include ../../components/footer
include ../../components/footer-files