// Tables caption { padding-top: var(--table-cell-padding); padding-bottom: var(--table-cell-padding); color: @text-muted; text-align: left; } th { text-align: left; } .table { width: 100%; max-width: 100%; margin-bottom: var(--line-height-computed); // Cells > thead, > tbody, > tfoot { > tr { > th, > td { padding: var(--table-cell-padding); line-height: var(--line-height-base); vertical-align: top; border-top: var(--1px) solid @table-border-color; } } } // Bottom align for column headings > thead > tr > th { vertical-align: bottom; border-bottom: var(--2px) solid @table-border-color; } // Remove top border from thead by default > caption + thead, > colgroup + thead, > thead:first-child { > tr:first-child { > th, > td { border-top: 0; } } } // Account for multiple tbody instances > tbody + tbody { border-top: var(--2px) solid @table-border-color; } // Nesting .table { background-color: @body-bg; } } .table-bordered { border: var(--1px) solid @table-border-color; > thead, > tbody, > tfoot { > tr { > th, > td { border: var(--1px) solid @table-border-color; } } } > thead > tr { > th, > td { border-bottom-width: var(--2px); } } } .table-striped { > tbody > tr:nth-of-type(odd) { background-color: var(--table-bg-accent); } } .table-hover { > tbody > tr:hover { background-color: @table-bg-hover; } } // Table cell sizing // // Reset default table behavior table col[class*="col-"] { position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) float: none; display: table-column; } table { td, th { &[class*="col-"] { position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) float: none; display: table-cell; } } } // Table backgrounds // // Exact selectors below required to override `.table-striped` and prevent // inheritance to nested tables. .table-row-variant-espo(active; @table-bg-active; @table-bg-active-5); .table-row-variant-espo(success; @state-success-bg; @state-success-bg-5); .table-row-variant-espo(info; @state-info-bg; @state-info-bg-5); .table-row-variant-espo(warning; @state-warning-bg; var(--state-warning-bg-5)); .table-row-variant-espo(danger; @state-danger-bg; var(--state-danger-bg-5)); // Responsive tables // // Wrap your tables in `.table-responsive` and we'll make them mobile friendly // by enabling horizontal scrolling. Only applies <768px. Everything above that // will display normally. .table-responsive { overflow-x: auto; min-height: 0.01%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837) @media screen and (max-width: @screen-xs-max) { width: 100%; margin-bottom: calc(var(--line-height-computed) * 0.75); overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; border: var(--1px) solid @table-border-color; // Tighten up spacing > .table { margin-bottom: 0; // Ensure the content doesn't wrap > thead, > tbody, > tfoot { > tr { > th, > td { white-space: nowrap; } } } } // Special overrides for the bordered tables > .table-bordered { border: 0; // Nuke the appropriate borders so that the parent can handle them > thead, > tbody, > tfoot { > tr { > th:first-child, > td:first-child { border-left: 0; } > th:last-child, > td:last-child { border-right: 0; } } } // Only nuke the last row's bottom-border in `tbody` and `tfoot` since // chances are there will be only one `tr` in a `thead` and that would // remove the border altogether. > tbody, > tfoot { > tr:last-child { > th, > td { border-bottom: 0; } } } } } }