tools/side_chain_tool/web/node_modules/bootstrap/scss/_tables.scss

   1 //
   2 // Basic Bootstrap table
   3 //
   4
   5 .table {
   6   width: 100%;
   7   margin-bottom: $spacer;
   8   background-color: $table-bg; // Reset for nesting within parents with `background-color`.
   9
  10   th,
  11   td {
  12     padding: $table-cell-padding;
  13     vertical-align: top;
  14     border-top: $table-border-width solid $table-border-color;
  15   }
  16
  17   thead th {
  18     vertical-align: bottom;
  19     border-bottom: (2 * $table-border-width) solid $table-border-color;
  20   }
  21
  22   tbody + tbody {
  23     border-top: (2 * $table-border-width) solid $table-border-color;
  24   }
  25
  26   .table {
  27     background-color: $body-bg;
  28   }
  29 }
  30
  31
  32 //
  33 // Condensed table w/ half padding
  34 //
  35
  36 .table-sm {
  37   th,
  38   td {
  39     padding: $table-cell-padding-sm;
  40   }
  41 }
  42
  43
  44 // Border versions
  45 //
  46 // Add or remove borders all around the table and between all the columns.
  47
  48 .table-bordered {
  49   border: $table-border-width solid $table-border-color;
  50
  51   th,
  52   td {
  53     border: $table-border-width solid $table-border-color;
  54   }
  55
  56   thead {
  57     th,
  58     td {
  59       border-bottom-width: (2 * $table-border-width);
  60     }
  61   }
  62 }
  63
  64 .table-borderless {
  65   th,
  66   td,
  67   thead th,
  68   tbody + tbody {
  69     border: 0;
  70   }
  71 }
  72
  73 // Zebra-striping
  74 //
  75 // Default zebra-stripe styles (alternating gray and transparent backgrounds)
  76
  77 .table-striped {
  78   tbody tr:nth-of-type(#{$table-striped-order}) {
  79     background-color: $table-accent-bg;
  80   }
  81 }
  82
  83
  84 // Hover effect
  85 //
  86 // Placed here since it has to come after the potential zebra striping
  87
  88 .table-hover {
  89   tbody tr {
  90     @include hover {
  91       background-color: $table-hover-bg;
  92     }
  93   }
  94 }
  95
  96
  97 // Table backgrounds
  98 //
  99 // Exact selectors below required to override `.table-striped` and prevent
 100 // inheritance to nested tables.
 101
 102 @each $color, $value in $theme-colors {
 103   @include table-row-variant($color, theme-color-level($color, -9));
 104 }
 105
 106 @include table-row-variant(active, $table-active-bg);
 107
 108
 109 // Dark styles
 110 //
 111 // Same table markup, but inverted color scheme: dark background and light text.
 112
 113 // stylelint-disable-next-line no-duplicate-selectors
 114 .table {
 115   .thead-dark {
 116     th {
 117       color: $table-dark-color;
 118       background-color: $table-dark-bg;
 119       border-color: $table-dark-border-color;
 120     }
 121   }
 122
 123   .thead-light {
 124     th {
 125       color: $table-head-color;
 126       background-color: $table-head-bg;
 127       border-color: $table-border-color;
 128     }
 129   }
 130 }
 131
 132 .table-dark {
 133   color: $table-dark-color;
 134   background-color: $table-dark-bg;
 135
 136   th,
 137   td,
 138   thead th {
 139     border-color: $table-dark-border-color;
 140   }
 141
 142   &.table-bordered {
 143     border: 0;
 144   }
 145
 146   &.table-striped {
 147     tbody tr:nth-of-type(odd) {
 148       background-color: $table-dark-accent-bg;
 149     }
 150   }
 151
 152   &.table-hover {
 153     tbody tr {
 154       @include hover {
 155         background-color: $table-dark-hover-bg;
 156       }
 157     }
 158   }
 159 }
 160
 161
 162 // Responsive tables
 163 //
 164 // Generate series of `.table-responsive-*` classes for configuring the screen
 165 // size of where your table will overflow.
 166
 167 .table-responsive {
 168   @each $breakpoint in map-keys($grid-breakpoints) {
 169     $next: breakpoint-next($breakpoint, $grid-breakpoints);
 170     $infix: breakpoint-infix($next, $grid-breakpoints);
 171
 172     &#{$infix} {
 173       @include media-breakpoint-down($breakpoint) {
 174         display: block;
 175         width: 100%;
 176         overflow-x: auto;
 177         -webkit-overflow-scrolling: touch;
 178         -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
 179
 180         // Prevent double border on horizontal scroll due to use of `display: block;`
 181         > .table-bordered {
 182           border: 0;
 183         }
 184       }
 185     }
 186   }
 187 }