UNPKG

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