UNPKG

19.2 kBCSSView Raw
1/**
2 * @author Dustin Utecht
3 * https://github.com/wenzhixin/bootstrap-table/
4 */
5.bootstrap-table .fixed-table-toolbar::after {
6 content: "";
7 display: block;
8 clear: both;
9}
10
11.bootstrap-table .fixed-table-toolbar .bs-bars,
12.bootstrap-table .fixed-table-toolbar .search,
13.bootstrap-table .fixed-table-toolbar .columns {
14 position: relative;
15 margin-top: 10px;
16 margin-bottom: 10px;
17}
18
19.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group {
20 display: inline-block;
21 margin-left: -1px !important;
22}
23
24.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group > .btn {
25 border-radius: 0;
26}
27
28.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:first-child > .btn {
29 border-top-left-radius: 4px;
30 border-bottom-left-radius: 4px;
31}
32
33.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:last-child > .btn {
34 border-top-right-radius: 4px;
35 border-bottom-right-radius: 4px;
36}
37
38.bootstrap-table .fixed-table-toolbar .columns .dropdown-menu {
39 text-align: left;
40 max-height: 300px;
41 overflow: auto;
42 -ms-overflow-style: scrollbar;
43 z-index: 1001;
44}
45
46.bootstrap-table .fixed-table-toolbar .columns label {
47 display: block;
48 padding: 3px 20px;
49 clear: both;
50 font-weight: normal;
51 line-height: 1.428571429;
52}
53
54.bootstrap-table .fixed-table-toolbar .columns-left {
55 margin-right: 5px;
56}
57
58.bootstrap-table .fixed-table-toolbar .columns-right {
59 margin-left: 5px;
60}
61
62.bootstrap-table .fixed-table-toolbar .pull-right .dropdown-menu {
63 right: 0;
64 left: auto;
65}
66
67.bootstrap-table .fixed-table-container {
68 position: relative;
69 clear: both;
70}
71
72.bootstrap-table .fixed-table-container .table {
73 width: 100%;
74 margin-bottom: 0 !important;
75}
76
77.bootstrap-table .fixed-table-container .table th,
78.bootstrap-table .fixed-table-container .table td {
79 vertical-align: middle;
80 box-sizing: border-box;
81}
82
83.bootstrap-table .fixed-table-container .table thead th {
84 vertical-align: bottom;
85 padding: 0;
86 margin: 0;
87}
88
89.bootstrap-table .fixed-table-container .table thead th:focus {
90 outline: 0 solid transparent;
91}
92
93.bootstrap-table .fixed-table-container .table thead th.detail {
94 width: 30px;
95}
96
97.bootstrap-table .fixed-table-container .table thead th .th-inner {
98 padding: 0.75rem;
99 vertical-align: bottom;
100 overflow: hidden;
101 text-overflow: ellipsis;
102 white-space: nowrap;
103}
104
105.bootstrap-table .fixed-table-container .table thead th .sortable {
106 cursor: pointer;
107 background-position: right;
108 background-repeat: no-repeat;
109 padding-right: 30px !important;
110}
111
112.bootstrap-table .fixed-table-container .table thead th .both {
113 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAQAAADYWf5HAAAAkElEQVQoz7X QMQ5AQBCF4dWQSJxC5wwax1Cq1e7BAdxD5SL+Tq/QCM1oNiJidwox0355mXnG/DrEtIQ6azioNZQxI0ykPhTQIwhCR+BmBYtlK7kLJYwWCcJA9M4qdrZrd8pPjZWPtOqdRQy320YSV17OatFC4euts6z39GYMKRPCTKY9UnPQ6P+GtMRfGtPnBCiqhAeJPmkqAAAAAElFTkSuQmCC");
114}
115
116.bootstrap-table .fixed-table-container .table thead th .asc {
117 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAZ0lEQVQ4y2NgGLKgquEuFxBPAGI2ahhWCsS/gDibUoO0gPgxEP8H4ttArEyuQYxAPBdqEAxPBImTY5gjEL9DM+wTENuQahAvEO9DMwiGdwAxOymGJQLxTyD+jgWDxCMZRsEoGAVoAADeemwtPcZI2wAAAABJRU5ErkJggg==");
118}
119
120.bootstrap-table .fixed-table-container .table thead th .desc {
121 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAZUlEQVQ4y2NgGAWjYBSggaqGu5FA/BOIv2PBIPFEUgxjB+IdQPwfC94HxLykus4GiD+hGfQOiB3J8SojEE9EM2wuSJzcsFMG4ttQgx4DsRalkZENxL+AuJQaMcsGxBOAmGvopk8AVz1sLZgg0bsAAAAASUVORK5CYII= ");
122}
123
124.bootstrap-table .fixed-table-container .table tbody tr.selected td {
125 background-color: #fafafa;
126}
127
128.bootstrap-table .fixed-table-container .table tbody tr.no-records-found td {
129 text-align: center;
130}
131
132.bootstrap-table .fixed-table-container .table tbody tr .card-view {
133 display: flex;
134}
135
136.bootstrap-table .fixed-table-container .table tbody tr .card-view .card-view-title {
137 font-weight: bold;
138 display: inline-block;
139 min-width: 30%;
140 width: auto !important;
141 text-align: left !important;
142}
143
144.bootstrap-table .fixed-table-container .table tbody tr .card-view .card-view-value {
145 width: 100% !important;
146}
147
148.bootstrap-table .fixed-table-container .table .bs-checkbox {
149 text-align: center;
150}
151
152.bootstrap-table .fixed-table-container .table .bs-checkbox label {
153 margin-bottom: 0;
154}
155
156.bootstrap-table .fixed-table-container .table .bs-checkbox label input[type="radio"],
157.bootstrap-table .fixed-table-container .table .bs-checkbox label input[type="checkbox"] {
158 margin: 0 auto !important;
159}
160
161.bootstrap-table .fixed-table-container .table.table-sm .th-inner {
162 padding: 0.3rem;
163}
164
165.bootstrap-table .fixed-table-container.fixed-height:not(.has-footer) {
166 border-bottom: 1px solid #dbdbdb;
167}
168
169.bootstrap-table .fixed-table-container.fixed-height.has-card-view {
170 border-top: 1px solid #dbdbdb;
171 border-bottom: 1px solid #dbdbdb;
172}
173
174.bootstrap-table .fixed-table-container.fixed-height .fixed-table-border {
175 border-left: 1px solid #dbdbdb;
176 border-right: 1px solid #dbdbdb;
177}
178
179.bootstrap-table .fixed-table-container.fixed-height .table thead th {
180 border-bottom: 1px solid #dbdbdb;
181}
182
183.bootstrap-table .fixed-table-container.fixed-height .table-dark thead th {
184 border-bottom: 1px solid #32383e;
185}
186
187.bootstrap-table .fixed-table-container .fixed-table-header {
188 overflow: hidden;
189}
190
191.bootstrap-table .fixed-table-container .fixed-table-body {
192 overflow-x: auto;
193 overflow-y: auto;
194 height: 100%;
195}
196
197.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading {
198 align-items: center;
199 background: #fff;
200 display: flex;
201 justify-content: center;
202 position: absolute;
203 bottom: 0;
204 width: 100%;
205 max-width: 100%;
206 z-index: 1000;
207 transition: visibility 0s, opacity 0.15s ease-in-out;
208 opacity: 0;
209 visibility: hidden;
210}
211
212.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.open {
213 visibility: visible;
214 opacity: 1;
215}
216
217.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap {
218 align-items: baseline;
219 display: flex;
220 justify-content: center;
221}
222
223.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .loading-text {
224 margin-right: 6px;
225}
226
227.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap {
228 align-items: center;
229 display: flex;
230 justify-content: center;
231}
232
233.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot,
234.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after,
235.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::before {
236 content: "";
237 animation-duration: 1.5s;
238 animation-iteration-count: infinite;
239 animation-name: LOADING;
240 background: #363636;
241 border-radius: 50%;
242 display: block;
243 height: 5px;
244 margin: 0 4px;
245 opacity: 0;
246 width: 5px;
247}
248
249.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot {
250 animation-delay: 0.3s;
251}
252
253.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after {
254 animation-delay: 0.6s;
255}
256
257.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark {
258 background: #363636;
259}
260
261.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-dot,
262.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-wrap::after,
263.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading.table-dark .animation-wrap::before {
264 background: #fff;
265}
266
267.bootstrap-table .fixed-table-container .fixed-table-footer {
268 overflow: hidden;
269}
270
271.bootstrap-table .fixed-table-pagination::after {
272 content: "";
273 display: block;
274 clear: both;
275}
276
277.bootstrap-table .fixed-table-pagination > .pagination-detail,
278.bootstrap-table .fixed-table-pagination > .pagination {
279 margin-top: 10px;
280 margin-bottom: 10px;
281}
282
283.bootstrap-table .fixed-table-pagination > .pagination-detail .pagination-info {
284 line-height: 34px;
285 margin-right: 5px;
286}
287
288.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list {
289 display: inline-block;
290}
291
292.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group {
293 position: relative;
294 display: inline-block;
295 vertical-align: middle;
296}
297
298.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group .dropdown-menu {
299 margin-bottom: 0;
300}
301
302.bootstrap-table .fixed-table-pagination > .pagination ul.pagination {
303 margin: 0;
304}
305
306.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a {
307 color: #c8c8c8;
308}
309
310.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a::before {
311 content: '\2B05';
312}
313
314.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a::after {
315 content: '\27A1';
316}
317
318.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.disabled a {
319 pointer-events: none;
320 cursor: default;
321}
322
323.bootstrap-table.fullscreen {
324 position: fixed;
325 top: 0;
326 left: 0;
327 z-index: 1050;
328 width: 100% !important;
329 background: #fff;
330 height: calc(100vh);
331 overflow-y: scroll;
332}
333
334.bootstrap-table.bootstrap4 .pagination-lg .page-link, .bootstrap-table.bootstrap5 .pagination-lg .page-link {
335 padding: .5rem 1rem;
336}
337
338.bootstrap-table.bootstrap5 .float-left {
339 float: left;
340}
341
342.bootstrap-table.bootstrap5 .float-right {
343 float: right;
344}
345
346/* calculate scrollbar width */
347div.fixed-table-scroll-inner {
348 width: 100%;
349 height: 200px;
350}
351
352div.fixed-table-scroll-outer {
353 top: 0;
354 left: 0;
355 visibility: hidden;
356 width: 200px;
357 height: 150px;
358 overflow: hidden;
359}
360
361@keyframes LOADING {
362 0% {
363 opacity: 0;
364 }
365 50% {
366 opacity: 1;
367 }
368 to {
369 opacity: 0;
370 }
371}
372
373@font-face {
374 font-family: 'bootstrap-table';
375 src: url("fonts/bootstrap-table.eot?gmdfsp");
376 src: url("fonts/bootstrap-table.eot") format("embedded-opentype"), url("fonts/bootstrap-table.ttf") format("truetype"), url("fonts/bootstrap-table.woff") format("woff"), url("fonts/bootstrap-table.svg") format("svg");
377 font-weight: normal;
378 font-style: normal;
379 font-display: block;
380}
381
382[class^="icon-"],
383[class*=" icon-"] {
384 /* use !important to prevent issues with browser extensions that change fonts */
385 font-family: 'bootstrap-table', sans-serif !important;
386 speak: none;
387 font-style: normal;
388 font-weight: normal;
389 font-variant: normal;
390 text-transform: none;
391 line-height: 1;
392 /* Better Font Rendering =========== */
393 -webkit-font-smoothing: antialiased;
394 -moz-osx-font-smoothing: grayscale;
395}
396
397.icon-arrow-down-circle:before {
398 content: "\e907";
399}
400
401.icon-arrow-up-circle:before {
402 content: "\e908";
403}
404
405.icon-chevron-left:before {
406 content: "\e900";
407}
408
409.icon-chevron-right:before {
410 content: "\e901";
411}
412
413.icon-clock:before {
414 content: "\e90c";
415}
416
417.icon-copy:before {
418 content: "\e909";
419}
420
421.icon-download:before {
422 content: "\e90d";
423}
424
425.icon-list:before {
426 content: "\e902";
427}
428
429.icon-maximize:before {
430 content: "\1f5ce";
431}
432
433.icon-minus:before {
434 content: "\e90f";
435}
436
437.icon-move:before {
438 content: "\e903";
439}
440
441.icon-plus:before {
442 content: "\e90e";
443}
444
445.icon-printer:before {
446 content: "\e90b";
447}
448
449.icon-refresh-cw:before {
450 content: "\e904";
451}
452
453.icon-search:before {
454 content: "\e90a";
455}
456
457.icon-toggle-right:before {
458 content: "\e905";
459}
460
461.icon-trash-2:before {
462 content: "\e906";
463}
464
465.icon-sort-amount-asc:before {
466 content: "\ea4c";
467}
468
469.bootstrap-table * {
470 box-sizing: border-box;
471}
472
473.bootstrap-table input.form-control,
474.bootstrap-table select.form-control,
475.bootstrap-table .btn {
476 border-radius: 4px;
477 background-color: #fff;
478 border: 1px solid #ccc;
479 padding: 9px 12px;
480}
481
482.bootstrap-table select.form-control {
483 height: 35px;
484}
485
486.bootstrap-table .btn {
487 outline: none;
488 cursor: pointer;
489}
490
491.bootstrap-table .btn.active {
492 background-color: #ebebeb;
493}
494
495.bootstrap-table .btn:focus, .bootstrap-table .btn:hover {
496 background-color: whitesmoke;
497}
498
499.bootstrap-table .caret {
500 display: inline-block;
501 width: 0;
502 height: 0;
503 margin-left: 2px;
504 vertical-align: middle;
505 border-top: 4px dashed;
506 border-top: 4px solid;
507 border-right: 4px solid transparent;
508 border-left: 4px solid transparent;
509}
510
511.bootstrap-table .detail-icon {
512 text-decoration: none;
513 color: #3679e4;
514}
515
516.bootstrap-table .detail-icon:hover {
517 color: #154a9f;
518}
519
520.bootstrap-table .fixed-table-toolbar .columns,
521.bootstrap-table .fixed-table-toolbar .columns .btn-group {
522 display: inline-block;
523}
524
525.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:first-child):not(:last-child),
526.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:first-child):not(:last-child) > .btn,
527.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:first-child):not(:last-child),
528.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:first-child):not(:last-child) > .btn {
529 border-radius: 0;
530}
531
532.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:last-child):not(.dropdown-toggle),
533.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:last-child) > .btn,
534.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:last-child):not(.dropdown-toggle),
535.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:last-child) > .btn {
536 border-top-right-radius: 0;
537 border-bottom-right-radius: 0;
538 border-right: none;
539}
540
541.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:first-child):not(.dropdown-toggle),
542.bootstrap-table .fixed-table-toolbar .columns > .btn:not(:first-child) > .btn,
543.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:first-child):not(.dropdown-toggle),
544.bootstrap-table .fixed-table-toolbar .columns > .btn-group:not(:first-child) > .btn {
545 border-top-left-radius: 0;
546 border-bottom-left-radius: 0;
547}
548
549.bootstrap-table .fixed-table-toolbar .columns label {
550 padding: 5px 12px;
551}
552
553.bootstrap-table .fixed-table-toolbar .columns input[type="checkbox"] {
554 vertical-align: middle;
555}
556
557.bootstrap-table .fixed-table-toolbar .columns .dropdown-divider {
558 border-bottom: 1px solid #dbdbdb;
559}
560
561.bootstrap-table .fixed-table-toolbar .search .input-group .search-input {
562 border-top-right-radius: 0;
563 border-bottom-right-radius: 0;
564 border-right: none;
565}
566
567.bootstrap-table .fixed-table-toolbar .search .input-group button[name="search"],
568.bootstrap-table .fixed-table-toolbar .search .input-group button[name="clearSearch"] {
569 border-top-left-radius: 0;
570 border-bottom-left-radius: 0;
571}
572
573.bootstrap-table .fixed-table-toolbar .search .input-group button[name="search"]:not(:last-child),
574.bootstrap-table .fixed-table-toolbar .search .input-group button[name="clearSearch"]:not(:last-child) {
575 border-top-right-radius: 0;
576 border-bottom-right-radius: 0;
577 border-right: none;
578}
579
580.bootstrap-table .open.dropdown-menu {
581 display: block;
582}
583
584.bootstrap-table .dropdown-menu-up .dropdown-menu {
585 top: auto;
586 bottom: 100%;
587}
588
589.bootstrap-table .dropdown-menu {
590 display: none;
591 background-color: #fff;
592 position: absolute;
593 right: 0;
594 min-width: 120px;
595 margin-top: 2px;
596 border: 1px solid #ccc;
597 border-radius: 4px;
598 -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.175);
599 box-shadow: 0 3px 12px rgba(0, 0, 0, 0.175);
600}
601
602.bootstrap-table .dropdown-menu .dropdown-item {
603 color: #363636;
604 text-decoration: none;
605 display: block;
606 padding: 5px 12px;
607 white-space: nowrap;
608}
609
610.bootstrap-table .dropdown-menu .dropdown-item:hover {
611 background-color: whitesmoke;
612}
613
614.bootstrap-table .dropdown-menu .dropdown-item.active {
615 background-color: #3679e4;
616 color: #fff;
617}
618
619.bootstrap-table .dropdown-menu .dropdown-item.active:hover {
620 background-color: #1b5fcc;
621}
622
623.bootstrap-table .columns-left .dropdown-menu {
624 left: 0;
625 right: auto;
626}
627
628.bootstrap-table .pagination-detail {
629 float: left;
630}
631
632.bootstrap-table .pagination-detail .dropdown-item {
633 min-width: 45px;
634 text-align: center;
635}
636
637.bootstrap-table table {
638 border-collapse: collapse;
639}
640
641.bootstrap-table table th {
642 text-align: inherit;
643}
644
645.bootstrap-table table.table-bordered thead tr th,
646.bootstrap-table table.table-bordered tbody tr td {
647 border: 1px solid #dbdbdb;
648}
649
650.bootstrap-table table.table-bordered tbody tr td {
651 padding: 0.75rem;
652}
653
654.bootstrap-table table.table-hover tbody tr:hover {
655 background: #fafafa;
656}
657
658.bootstrap-table .float-left {
659 float: left;
660}
661
662.bootstrap-table .float-right {
663 float: right;
664}
665
666.bootstrap-table .pagination {
667 padding: 0;
668 align-items: center;
669 display: flex;
670 justify-content: center;
671 text-align: center;
672 list-style: none;
673}
674
675.bootstrap-table .pagination .page-item {
676 border: 1px solid #dbdbdb;
677 background-color: #fff;
678 border-radius: 4px;
679 margin: 2px;
680 padding: 5px 2px 5px 2px;
681}
682
683.bootstrap-table .pagination .page-item:hover {
684 background-color: whitesmoke;
685}
686
687.bootstrap-table .pagination .page-item .page-link {
688 padding: 6px 12px;
689 line-height: 1.428571429;
690 color: #363636;
691 text-decoration: none;
692 outline: none;
693}
694
695.bootstrap-table .pagination .page-item.active {
696 background-color: #3679e4;
697 border: 1px solid #206ae1;
698}
699
700.bootstrap-table .pagination .page-item.active .page-link {
701 color: #fff;
702}
703
704.bootstrap-table .pagination .page-item.active:hover {
705 background-color: #1b5fcc;
706}
707
708.bootstrap-table .pagination .btn-group {
709 display: inline-block;
710}
711
712.bootstrap-table .pagination .btn-group .btn:not(:first-child):not(:last-child),
713.bootstrap-table .pagination .btn-group input:not(:first-child):not(:last-child) {
714 border-radius: 0;
715}
716
717.bootstrap-table .pagination .btn-group .btn:first-child:not(:last-child):not(.dropdown-toggle),
718.bootstrap-table .pagination .btn-group input:first-child:not(:last-child):not(.dropdown-toggle) {
719 border-top-right-radius: 0;
720 border-bottom-right-radius: 0;
721}
722
723.bootstrap-table .pagination .btn-group .btn:last-child:not(:first-child),
724.bootstrap-table .pagination .btn-group input:last-child:not(:first-child) {
725 border-top-left-radius: 0;
726 border-bottom-left-radius: 0;
727}
728
729.bootstrap-table .pagination .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
730 border-top-left-radius: 0;
731 border-bottom-left-radius: 0;
732}
733
734.bootstrap-table .filter-control {
735 display: flex;
736}
737
738.bootstrap-table .page-jump-to input,
739.bootstrap-table .page-jump-to .btn {
740 padding: 8px 12px;
741}
742
743.modal {
744 position: fixed;
745 display: none;
746 top: 0;
747 left: 0;
748 bottom: 0;
749 right: 0;
750}
751
752.modal.show {
753 display: flex;
754}
755
756.modal .btn {
757 border-radius: 4px;
758 background-color: #fff;
759 border: 1px solid #ccc;
760 padding: 6px 12px;
761 outline: none;
762 cursor: pointer;
763}
764
765.modal .btn.active {
766 border-color: black;
767}
768
769.modal .modal-background {
770 position: fixed;
771 top: 0;
772 left: 0;
773 bottom: 0;
774 right: 0;
775 z-index: 998;
776 background-color: rgba(10, 10, 10, 0.86);
777}
778
779.modal .modal-content {
780 position: relative;
781 width: 600px;
782 margin: 30px auto;
783 z-index: 999;
784}
785
786.modal .modal-content .box {
787 background-color: #fff;
788 border-radius: 6px;
789 display: block;
790 padding: 1.25rem;
791}