2 // Basic Bootstrap table
7 margin-bottom: $spacer;
8 background-color: $table-bg; // Reset for nesting within parents with `background-color`.
12 padding: $table-cell-padding;
14 border-top: $table-border-width solid $table-border-color;
18 vertical-align: bottom;
19 border-bottom: (2 * $table-border-width) solid $table-border-color;
23 border-top: (2 * $table-border-width) solid $table-border-color;
27 background-color: $body-bg;
33 // Condensed table w/ half padding
39 padding: $table-cell-padding-sm;
46 // Add or remove borders all around the table and between all the columns.
49 border: $table-border-width solid $table-border-color;
53 border: $table-border-width solid $table-border-color;
59 border-bottom-width: (2 * $table-border-width);
75 // Default zebra-stripe styles (alternating gray and transparent backgrounds)
78 tbody tr:nth-of-type(#{$table-striped-order}) {
79 background-color: $table-accent-bg;
86 // Placed here since it has to come after the potential zebra striping
91 background-color: $table-hover-bg;
99 // Exact selectors below required to override `.table-striped` and prevent
100 // inheritance to nested tables.
102 @each $color, $value in $theme-colors {
103 @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
106 @include table-row-variant(active, $table-active-bg);
111 // Same table markup, but inverted color scheme: dark background and light text.
113 // stylelint-disable-next-line no-duplicate-selectors
117 color: $table-dark-color;
118 background-color: $table-dark-bg;
119 border-color: $table-dark-border-color;
125 color: $table-head-color;
126 background-color: $table-head-bg;
127 border-color: $table-border-color;
133 color: $table-dark-color;
134 background-color: $table-dark-bg;
139 border-color: $table-dark-border-color;
147 tbody tr:nth-of-type(odd) {
148 background-color: $table-dark-accent-bg;
155 background-color: $table-dark-hover-bg;
164 // Generate series of `.table-responsive-*` classes for configuring the screen
165 // size of where your table will overflow.
168 @each $breakpoint in map-keys($grid-breakpoints) {
169 $next: breakpoint-next($breakpoint, $grid-breakpoints);
170 $infix: breakpoint-infix($next, $grid-breakpoints);
173 @include media-breakpoint-down($breakpoint) {
177 -webkit-overflow-scrolling: touch;
178 -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
180 // Prevent double border on horizontal scroll due to use of `display: block;`