Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | // |
| 2 | // Tables |
||
| 3 | // -------------------------------------------------- |
||
| 4 | |||
| 5 | |||
| 6 | table { |
||
| 7 | background-color: $table-bg; |
||
| 8 | } |
||
| 9 | caption { |
||
| 10 | padding-top: $table-cell-padding; |
||
| 11 | padding-bottom: $table-cell-padding; |
||
| 12 | color: $text-muted; |
||
| 13 | text-align: left; |
||
| 14 | } |
||
| 15 | th { |
||
| 16 | text-align: left; |
||
| 17 | } |
||
| 18 | |||
| 19 | |||
| 20 | // Baseline styles |
||
| 21 | |||
| 22 | .table { |
||
| 23 | width: 100%; |
||
| 24 | max-width: 100%; |
||
| 25 | margin-bottom: $line-height-computed; |
||
| 26 | // Cells |
||
| 27 | > thead, |
||
| 28 | > tbody, |
||
| 29 | > tfoot { |
||
| 30 | > tr { |
||
| 31 | > th, |
||
| 32 | > td { |
||
| 33 | padding: $table-cell-padding; |
||
| 34 | line-height: $line-height-base; |
||
| 35 | vertical-align: top; |
||
| 36 | border-top: 1px solid $table-border-color; |
||
| 37 | } |
||
| 38 | } |
||
| 39 | } |
||
| 40 | // Bottom align for column headings |
||
| 41 | > thead > tr > th { |
||
| 42 | vertical-align: bottom; |
||
| 43 | border-bottom: 2px solid $table-border-color; |
||
| 44 | } |
||
| 45 | // Remove top border from thead by default |
||
| 46 | > caption + thead, |
||
| 47 | > colgroup + thead, |
||
| 48 | > thead:first-child { |
||
| 49 | > tr:first-child { |
||
| 50 | > th, |
||
| 51 | > td { |
||
| 52 | border-top: 0; |
||
| 53 | } |
||
| 54 | } |
||
| 55 | } |
||
| 56 | // Account for multiple tbody instances |
||
| 57 | > tbody + tbody { |
||
| 58 | border-top: 2px solid $table-border-color; |
||
| 59 | } |
||
| 60 | |||
| 61 | // Nesting |
||
| 62 | .table { |
||
| 63 | background-color: $body-bg; |
||
| 64 | } |
||
| 65 | } |
||
| 66 | |||
| 67 | |||
| 68 | // Condensed table w/ half padding |
||
| 69 | |||
| 70 | .table-condensed { |
||
| 71 | > thead, |
||
| 72 | > tbody, |
||
| 73 | > tfoot { |
||
| 74 | > tr { |
||
| 75 | > th, |
||
| 76 | > td { |
||
| 77 | padding: $table-condensed-cell-padding; |
||
| 78 | } |
||
| 79 | } |
||
| 80 | } |
||
| 81 | } |
||
| 82 | |||
| 83 | |||
| 84 | // Bordered version |
||
| 85 | // |
||
| 86 | // Add borders all around the table and between all the columns. |
||
| 87 | |||
| 88 | .table-bordered { |
||
| 89 | border: 1px solid $table-border-color; |
||
| 90 | > thead, |
||
| 91 | > tbody, |
||
| 92 | > tfoot { |
||
| 93 | > tr { |
||
| 94 | > th, |
||
| 95 | > td { |
||
| 96 | border: 1px solid $table-border-color; |
||
| 97 | } |
||
| 98 | } |
||
| 99 | } |
||
| 100 | > thead > tr { |
||
| 101 | > th, |
||
| 102 | > td { |
||
| 103 | border-bottom-width: 2px; |
||
| 104 | } |
||
| 105 | } |
||
| 106 | } |
||
| 107 | |||
| 108 | |||
| 109 | // Zebra-striping |
||
| 110 | // |
||
| 111 | // Default zebra-stripe styles (alternating gray and transparent backgrounds) |
||
| 112 | |||
| 113 | .table-striped { |
||
| 114 | > tbody > tr:nth-of-type(odd) { |
||
| 115 | background-color: $table-bg-accent; |
||
| 116 | } |
||
| 117 | } |
||
| 118 | |||
| 119 | |||
| 120 | // Hover effect |
||
| 121 | // |
||
| 122 | // Placed here since it has to come after the potential zebra striping |
||
| 123 | |||
| 124 | .table-hover { |
||
| 125 | > tbody > tr:hover { |
||
| 126 | background-color: $table-bg-hover; |
||
| 127 | } |
||
| 128 | } |
||
| 129 | |||
| 130 | |||
| 131 | // Table cell sizing |
||
| 132 | // |
||
| 133 | // Reset default table behavior |
||
| 134 | |||
| 135 | table col[class*="col-"] { |
||
| 136 | position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) |
||
| 137 | float: none; |
||
| 138 | display: table-column; |
||
| 139 | } |
||
| 140 | table { |
||
| 141 | td, |
||
| 142 | th { |
||
| 143 | &[class*="col-"] { |
||
| 144 | position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) |
||
| 145 | float: none; |
||
| 146 | display: table-cell; |
||
| 147 | } |
||
| 148 | } |
||
| 149 | } |
||
| 150 | |||
| 151 | |||
| 152 | // Table backgrounds |
||
| 153 | // |
||
| 154 | // Exact selectors below required to override `.table-striped` and prevent |
||
| 155 | // inheritance to nested tables. |
||
| 156 | |||
| 157 | // Generate the contextual variants |
||
| 158 | @include table-row-variant('active', $table-bg-active); |
||
| 159 | @include table-row-variant('success', $state-success-bg); |
||
| 160 | @include table-row-variant('info', $state-info-bg); |
||
| 161 | @include table-row-variant('warning', $state-warning-bg); |
||
| 162 | @include table-row-variant('danger', $state-danger-bg); |
||
| 163 | |||
| 164 | |||
| 165 | // Responsive tables |
||
| 166 | // |
||
| 167 | // Wrap your tables in `.table-responsive` and we'll make them mobile friendly |
||
| 168 | // by enabling horizontal scrolling. Only applies <768px. Everything above that |
||
| 169 | // will display normally. |
||
| 170 | |||
| 171 | .table-responsive { |
||
| 172 | overflow-x: auto; |
||
| 173 | min-height: 0.01%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837) |
||
| 174 | |||
| 175 | @media screen and (max-width: $screen-xs-max) { |
||
| 176 | width: 100%; |
||
| 177 | margin-bottom: ($line-height-computed * 0.75); |
||
| 178 | overflow-y: hidden; |
||
| 179 | -ms-overflow-style: -ms-autohiding-scrollbar; |
||
| 180 | border: 1px solid $table-border-color; |
||
| 181 | |||
| 182 | // Tighten up spacing |
||
| 183 | > .table { |
||
| 184 | margin-bottom: 0; |
||
| 185 | |||
| 186 | // Ensure the content doesn't wrap |
||
| 187 | > thead, |
||
| 188 | > tbody, |
||
| 189 | > tfoot { |
||
| 190 | > tr { |
||
| 191 | > th, |
||
| 192 | > td { |
||
| 193 | white-space: nowrap; |
||
| 194 | } |
||
| 195 | } |
||
| 196 | } |
||
| 197 | } |
||
| 198 | |||
| 199 | // Special overrides for the bordered tables |
||
| 200 | > .table-bordered { |
||
| 201 | border: 0; |
||
| 202 | |||
| 203 | // Nuke the appropriate borders so that the parent can handle them |
||
| 204 | > thead, |
||
| 205 | > tbody, |
||
| 206 | > tfoot { |
||
| 207 | > tr { |
||
| 208 | > th:first-child, |
||
| 209 | > td:first-child { |
||
| 210 | border-left: 0; |
||
| 211 | } |
||
| 212 | > th:last-child, |
||
| 213 | > td:last-child { |
||
| 214 | border-right: 0; |
||
| 215 | } |
||
| 216 | } |
||
| 217 | } |
||
| 218 | |||
| 219 | // Only nuke the last row's bottom-border in `tbody` and `tfoot` since |
||
| 220 | // chances are there will be only one `tr` in a `thead` and that would |
||
| 221 | // remove the border altogether. |
||
| 222 | > tbody, |
||
| 223 | > tfoot { |
||
| 224 | > tr:last-child { |
||
| 225 | > th, |
||
| 226 | > td { |
||
| 227 | border-bottom: 0; |
||
| 228 | } |
||
| 229 | } |
||
| 230 | } |
||
| 231 | |||
| 232 | } |
||
| 233 | } |
||
| 234 | } |