UNPKG

10.3 kBCSSView Raw
1/**
2 * @author zhixin wen <wenzhixin2010@gmail.com>
3 * version: 1.21.1
4 * https://github.com/wenzhixin/bootstrap-table/
5 */
6.bootstrap-table .fixed-table-toolbar::after {
7 content: "";
8 display: block;
9 clear: both;
10}
11
12.bootstrap-table .fixed-table-toolbar .bs-bars,
13.bootstrap-table .fixed-table-toolbar .search,
14.bootstrap-table .fixed-table-toolbar .columns {
15 position: relative;
16 margin-top: 10px;
17 margin-bottom: 10px;
18}
19
20.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group {
21 display: inline-block;
22 margin-left: -1px !important;
23}
24
25.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group > .btn {
26 border-radius: 0;
27}
28
29.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:first-child > .btn {
30 border-top-left-radius: 4px;
31 border-bottom-left-radius: 4px;
32}
33
34.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:last-child > .btn {
35 border-top-right-radius: 4px;
36 border-bottom-right-radius: 4px;
37}
38
39.bootstrap-table .fixed-table-toolbar .columns .dropdown-menu {
40 text-align: left;
41 max-height: 300px;
42 overflow: auto;
43 -ms-overflow-style: scrollbar;
44 z-index: 1001;
45}
46
47.bootstrap-table .fixed-table-toolbar .columns label {
48 display: block;
49 padding: 3px 20px;
50 clear: both;
51 font-weight: normal;
52 line-height: 1.4286;
53}
54
55.bootstrap-table .fixed-table-toolbar .columns-left {
56 margin-right: 5px;
57}
58
59.bootstrap-table .fixed-table-toolbar .columns-right {
60 margin-left: 5px;
61}
62
63.bootstrap-table .fixed-table-toolbar .pull-right .dropdown-menu {
64 right: 0;
65 left: auto;
66}
67
68.bootstrap-table .fixed-table-container {
69 position: relative;
70 clear: both;
71}
72
73.bootstrap-table .fixed-table-container .table {
74 width: 100%;
75 margin-bottom: 0 !important;
76}
77
78.bootstrap-table .fixed-table-container .table th,
79.bootstrap-table .fixed-table-container .table td {
80 vertical-align: middle;
81 box-sizing: border-box;
82}
83
84.bootstrap-table .fixed-table-container .table thead th {
85 vertical-align: bottom;
86 padding: 0;
87 margin: 0;
88}
89
90.bootstrap-table .fixed-table-container .table thead th:focus {
91 outline: 0 solid transparent;
92}
93
94.bootstrap-table .fixed-table-container .table thead th.detail {
95 width: 30px;
96}
97
98.bootstrap-table .fixed-table-container .table thead th .th-inner {
99 padding: 0.75rem;
100 vertical-align: bottom;
101 overflow: hidden;
102 text-overflow: ellipsis;
103 white-space: nowrap;
104}
105
106.bootstrap-table .fixed-table-container .table thead th .sortable {
107 cursor: pointer;
108 background-position: right;
109 background-repeat: no-repeat;
110 padding-right: 30px !important;
111}
112
113.bootstrap-table .fixed-table-container .table thead th .sortable.sortable-center {
114 padding-left: 20px !important;
115 padding-right: 20px !important;
116}
117
118.bootstrap-table .fixed-table-container .table thead th .both {
119 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAQAAADYWf5HAAAAkElEQVQoz7X QMQ5AQBCF4dWQSJxC5wwax1Cq1e7BAdxD5SL+Tq/QCM1oNiJidwox0355mXnG/DrEtIQ6azioNZQxI0ykPhTQIwhCR+BmBYtlK7kLJYwWCcJA9M4qdrZrd8pPjZWPtOqdRQy320YSV17OatFC4euts6z39GYMKRPCTKY9UnPQ6P+GtMRfGtPnBCiqhAeJPmkqAAAAAElFTkSuQmCC");
120}
121
122.bootstrap-table .fixed-table-container .table thead th .asc {
123 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAZ0lEQVQ4y2NgGLKgquEuFxBPAGI2ahhWCsS/gDibUoO0gPgxEP8H4ttArEyuQYxAPBdqEAxPBImTY5gjEL9DM+wTENuQahAvEO9DMwiGdwAxOymGJQLxTyD+jgWDxCMZRsEoGAVoAADeemwtPcZI2wAAAABJRU5ErkJggg==");
124}
125
126.bootstrap-table .fixed-table-container .table thead th .desc {
127 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAZUlEQVQ4y2NgGAWjYBSggaqGu5FA/BOIv2PBIPFEUgxjB+IdQPwfC94HxLykus4GiD+hGfQOiB3J8SojEE9EM2wuSJzcsFMG4ttQgx4DsRalkZENxL+AuJQaMcsGxBOAmGvopk8AVz1sLZgg0bsAAAAASUVORK5CYII= ");
128}
129
130.bootstrap-table .fixed-table-container .table tbody tr.selected td {
131 background-color: rgba(0, 0, 0, 0.075);
132}
133
134.bootstrap-table .fixed-table-container .table tbody tr.no-records-found td {
135 text-align: center;
136}
137
138.bootstrap-table .fixed-table-container .table tbody tr .card-view {
139 display: flex;
140}
141
142.bootstrap-table .fixed-table-container .table tbody tr .card-view .card-view-title {
143 font-weight: bold;
144 display: inline-block;
145 min-width: 30%;
146 width: auto !important;
147 text-align: left !important;
148}
149
150.bootstrap-table .fixed-table-container .table tbody tr .card-view .card-view-value {
151 width: 100% !important;
152 text-align: left !important;
153}
154
155.bootstrap-table .fixed-table-container .table .bs-checkbox {
156 text-align: center;
157}
158
159.bootstrap-table .fixed-table-container .table .bs-checkbox label {
160 margin-bottom: 0;
161}
162
163.bootstrap-table .fixed-table-container .table .bs-checkbox label input[type="radio"],
164.bootstrap-table .fixed-table-container .table .bs-checkbox label input[type="checkbox"] {
165 margin: 0 auto !important;
166}
167
168.bootstrap-table .fixed-table-container .table.table-sm .th-inner {
169 padding: 0.3rem;
170}
171
172.bootstrap-table .fixed-table-container.fixed-height:not(.has-footer) {
173 border-bottom: 1px solid #dee2e6;
174}
175
176.bootstrap-table .fixed-table-container.fixed-height.has-card-view {
177 border-top: 1px solid #dee2e6;
178 border-bottom: 1px solid #dee2e6;
179}
180
181.bootstrap-table .fixed-table-container.fixed-height .fixed-table-border {
182 border-left: 1px solid #dee2e6;
183 border-right: 1px solid #dee2e6;
184}
185
186.bootstrap-table .fixed-table-container.fixed-height .table thead th {
187 border-bottom: 1px solid #dee2e6;
188}
189
190.bootstrap-table .fixed-table-container.fixed-height .table-dark thead th {
191 border-bottom: 1px solid #32383e;
192}
193
194.bootstrap-table .fixed-table-container .fixed-table-header {
195 overflow: hidden;
196}
197
198.bootstrap-table .fixed-table-container .fixed-table-body {
199 overflow-x: auto;
200 overflow-y: auto;
201 height: 100%;
202}
203
204.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading {
205 align-items: center;
206 background: #fff;
207 display: flex;
208 justify-content: center;
209 position: absolute;
210 bottom: 0;
211 width: 100%;
212 max-width: 100%;
213 z-index: 1000;
214 transition: visibility 0s, opacity 0.15s ease-in-out;
215 opacity: 0;
216 visibility: hidden;
217}
218
219.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.open {
220 visibility: visible;
221 opacity: 1;
222}
223
224.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap {
225 align-items: baseline;
226 display: flex;
227 justify-content: center;
228}
229
230.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .loading-text {
231 margin-right: 6px;
232}
233
234.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap {
235 align-items: center;
236 display: flex;
237 justify-content: center;
238}
239
240.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot,
241.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after,
242.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::before {
243 content: "";
244 animation-duration: 1.5s;
245 animation-iteration-count: infinite;
246 animation-name: loading;
247 background: #212529;
248 border-radius: 50%;
249 display: block;
250 height: 5px;
251 margin: 0 4px;
252 opacity: 0;
253 width: 5px;
254}
255
256.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot {
257 animation-delay: 0.3s;
258}
259
260.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after {
261 animation-delay: 0.6s;
262}
263
264.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark {
265 background: #212529;
266}
267
268.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-dot,
269.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-wrap::after,
270.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-wrap::before {
271 background: #fff;
272}
273
274.bootstrap-table .fixed-table-container .fixed-table-footer {
275 overflow: hidden;
276}
277
278.bootstrap-table .fixed-table-pagination::after {
279 content: "";
280 display: block;
281 clear: both;
282}
283
284.bootstrap-table .fixed-table-pagination > .pagination-detail,
285.bootstrap-table .fixed-table-pagination > .pagination {
286 margin-top: 10px;
287 margin-bottom: 10px;
288}
289
290.bootstrap-table .fixed-table-pagination > .pagination-detail .pagination-info {
291 line-height: 34px;
292 margin-right: 5px;
293}
294
295.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list {
296 display: inline-block;
297}
298
299.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group {
300 position: relative;
301 display: inline-block;
302 vertical-align: middle;
303}
304
305.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group .dropdown-menu {
306 margin-bottom: 0;
307}
308
309.bootstrap-table .fixed-table-pagination > .pagination ul.pagination {
310 margin: 0;
311}
312
313.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a {
314 color: #c8c8c8;
315}
316
317.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a::before {
318 content: "\2B05";
319}
320
321.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a::after {
322 content: "\27A1";
323}
324
325.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.disabled a {
326 pointer-events: none;
327 cursor: default;
328}
329
330.bootstrap-table.fullscreen {
331 position: fixed;
332 top: 0;
333 left: 0;
334 z-index: 1050;
335 width: 100% !important;
336 background: #fff;
337 height: calc(100vh);
338 overflow-y: scroll;
339}
340
341.bootstrap-table.bootstrap4 .pagination-lg .page-link, .bootstrap-table.bootstrap5 .pagination-lg .page-link {
342 padding: .5rem 1rem;
343}
344
345.bootstrap-table.bootstrap5 .float-left {
346 float: left;
347}
348
349.bootstrap-table.bootstrap5 .float-right {
350 float: right;
351}
352
353/* calculate scrollbar width */
354div.fixed-table-scroll-inner {
355 width: 100%;
356 height: 200px;
357}
358
359div.fixed-table-scroll-outer {
360 top: 0;
361 left: 0;
362 visibility: hidden;
363 width: 200px;
364 height: 150px;
365 overflow: hidden;
366}
367
368@keyframes loading {
369 0% {
370 opacity: 0;
371 }
372 50% {
373 opacity: 1;
374 }
375 to {
376 opacity: 0;
377 }
378}