Mercurial > minori

comparison dep/fmt/doc/bootstrap/tables.less @ 343:1faa72660932

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
*: transfer back to cmake from autotools autotools just made lots of things more complicated than they should have and many things broke (i.e. translations)
author Paper <paper@paper.us.eu.org>
date Thu, 20 Jun 2024 05:56:06 -0400
parents
children
comparison
equal deleted inserted replaced
342:adb79bdde329 343:1faa72660932
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 .table-row-variant(active; @table-bg-active);
159 .table-row-variant(success; @state-success-bg);
160 .table-row-variant(info; @state-info-bg);
161 .table-row-variant(warning; @state-warning-bg);
162 .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 }