123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151 |
- .table {
- --#{$variable-prefix}table-bg: #{$table-bg};
- --#{$variable-prefix}table-accent-bg: #{$table-accent-bg};
- --#{$variable-prefix}table-striped-color: #{$table-striped-color};
- --#{$variable-prefix}table-striped-bg: #{$table-striped-bg};
- --#{$variable-prefix}table-active-color: #{$table-active-color};
- --#{$variable-prefix}table-active-bg: #{$table-active-bg};
- --#{$variable-prefix}table-hover-color: #{$table-hover-color};
- --#{$variable-prefix}table-hover-bg: #{$table-hover-bg};
- width: 100%;
- margin-bottom: $spacer;
- color: $table-color;
- vertical-align: $table-cell-vertical-align;
- border-color: $table-border-color;
-
-
-
-
-
- > :not(caption) > * > * {
- padding: $table-cell-padding-y $table-cell-padding-x;
- background-color: var(--#{$variable-prefix}table-bg);
- border-bottom-width: $table-border-width;
- box-shadow: inset 0 0 0 9999px var(--#{$variable-prefix}table-accent-bg);
- }
- > tbody {
- vertical-align: inherit;
- }
- > thead {
- vertical-align: bottom;
- }
-
- > :not(:last-child) > :last-child > * {
- border-bottom-color: $table-group-separator-color;
- }
- }
- .caption-top {
- caption-side: top;
- }
- .table-sm {
-
- > :not(caption) > * > * {
- padding: $table-cell-padding-y-sm $table-cell-padding-x-sm;
- }
- }
- .table-bordered {
- > :not(caption) > * {
- border-width: $table-border-width 0;
-
- > * {
- border-width: 0 $table-border-width;
- }
- }
- }
- .table-borderless {
-
- > :not(caption) > * > * {
- border-bottom-width: 0;
- }
- }
- .table-striped {
- > tbody > tr:nth-of-type(#{$table-striped-order}) {
- --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-striped-bg);
- color: var(--#{$variable-prefix}table-striped-color);
- }
- }
- .table-active {
- --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-active-bg);
- color: var(--#{$variable-prefix}table-active-color);
- }
- .table-hover {
- > tbody > tr:hover {
- --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-hover-bg);
- color: var(--#{$variable-prefix}table-hover-color);
- }
- }
- @each $color, $value in $table-variants {
- @include table-variant($color, $value);
- }
- @each $breakpoint in map-keys($grid-breakpoints) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
- @include media-breakpoint-down($breakpoint) {
- .table-responsive#{$infix} {
- overflow-x: auto;
- -webkit-overflow-scrolling: touch;
- }
- }
- }
|