Lines 180-188
table {
Link Here
|
180 |
td { |
180 |
td { |
181 |
padding: .5em; |
181 |
padding: .5em; |
182 |
} |
182 |
} |
|
|
183 |
|
183 |
tr.dtrg-group { |
184 |
tr.dtrg-group { |
184 |
td { |
185 |
td { |
185 |
background: #e0e0e0; |
186 |
background: #E0E0E0; |
186 |
} |
187 |
} |
187 |
} |
188 |
} |
188 |
} |
189 |
} |
Lines 455-495
div {
Link Here
|
455 |
} |
456 |
} |
456 |
} |
457 |
} |
457 |
|
458 |
|
458 |
.dt-info { |
|
|
459 |
float: none; |
460 |
line-height: 1.9em; |
461 |
padding-right: 1em; |
462 |
padding-top: 0; |
463 |
} |
464 |
|
465 |
.dt-length { |
466 |
display: none; |
467 |
float: none; |
468 |
line-height: 1.5em; |
469 |
padding-right: 1em; |
470 |
} |
471 |
|
472 |
.dt-input { |
473 |
float: none; |
474 |
padding-right: 1em; |
475 |
white-space: nowrap; |
476 |
|
477 |
input { |
478 |
border-radius: 0; |
479 |
padding: 1px 2px; |
480 |
} |
481 |
} |
482 |
|
483 |
.dt-buttons { |
459 |
.dt-buttons { |
484 |
display: flex; |
460 |
display: flex; |
485 |
flex-grow: 1; |
461 |
flex-grow: 1; |
486 |
justify-content: flex-end; |
|
|
487 |
|
462 |
|
488 |
> .dt-button { |
463 |
> .dt-button { |
489 |
background: transparent none; |
464 |
background: transparent none; |
490 |
border: 1px solid transparent; |
465 |
border: 1px solid transparent; |
|
|
466 |
display: unset; |
491 |
font-size: .9rem; |
467 |
font-size: .9rem; |
492 |
padding: .3rem .5rem; |
468 |
padding: .3rem .5rem; |
|
|
469 |
position: unset; |
493 |
|
470 |
|
494 |
&:hover:not( .disabled ) { |
471 |
&:hover:not( .disabled ) { |
495 |
background: #EEE none; |
472 |
background: #EEE none; |
Lines 503-525
div {
Link Here
|
503 |
} |
480 |
} |
504 |
|
481 |
|
505 |
.dt-paging { |
482 |
.dt-paging { |
506 |
float: none; |
|
|
507 |
line-height: 1.5em; |
508 |
padding: 0; |
509 |
padding-right: 1em; |
510 |
|
511 |
span { |
512 |
.dt-paging-button, |
513 |
.ellipsis { |
514 |
display: none; |
515 |
} |
516 |
} |
517 |
|
518 |
.dt-paging-button { |
483 |
.dt-paging-button { |
519 |
border: 1px solid transparent; |
484 |
border: 1px solid transparent; |
520 |
border-radius: 0; |
485 |
border-radius: 0; |
521 |
color: $green-text-color; |
486 |
color: $green-text-color; |
522 |
padding: .2em 1em .5em 1em; |
487 |
padding: .2em .7em .5em .7em; |
523 |
|
488 |
|
524 |
&:hover, |
489 |
&:hover, |
525 |
&:active { |
490 |
&:active { |
Lines 597-602
div {
Link Here
|
597 |
} |
562 |
} |
598 |
} |
563 |
} |
599 |
|
564 |
|
|
|
565 |
.dt-info-row { |
566 |
border-bottom: 1px solid $table-border-color; |
567 |
flex-grow: 1; |
568 |
padding: .5rem 0; |
569 |
} |
570 |
|
571 |
.dt-search-buttons { |
572 |
flex-grow: 1; |
573 |
} |
574 |
|
600 |
.dt-button-collection { |
575 |
.dt-button-collection { |
601 |
width: auto; |
576 |
width: auto; |
602 |
|
577 |
|
Lines 678-684
div {
Link Here
|
678 |
top: unset; |
653 |
top: unset; |
679 |
} |
654 |
} |
680 |
} |
655 |
} |
681 |
|
|
|
682 |
} |
656 |
} |
683 |
|
657 |
|
684 |
.dt-button-down-arrow { |
658 |
.dt-button-down-arrow { |
Lines 687-717
div {
Link Here
|
687 |
padding-left: .3rem; |
661 |
padding-left: .3rem; |
688 |
} |
662 |
} |
689 |
|
663 |
|
690 |
.dt-info { |
664 |
.dt-paging-row { |
691 |
margin-top: .5em; |
|
|
692 |
|
693 |
& + .pager { |
694 |
border-top: 1px solid $table-border-color; |
695 |
margin-top: .3em; |
696 |
} |
697 |
} |
698 |
|
699 |
.dt-length, .dt-paging, .dt-search { |
700 |
display: flex; |
701 |
flex-wrap: wrap; |
665 |
flex-wrap: wrap; |
702 |
font-size: 90%; |
666 |
font-size: 90%; |
|
|
667 |
gap: 1rem; |
668 |
} |
703 |
|
669 |
|
704 |
&.top { |
670 |
#dt-paging-top { |
705 |
padding-top: 1em; |
671 |
.dt-layout-cell { |
706 |
} |
672 |
.dt-buttons { |
707 |
|
673 |
/* Override left margin to keep "Clear" button next to search field */ |
708 |
&.bottom { |
674 |
margin-left: 0; |
709 |
border-bottom: 1px solid $table-border-color; |
675 |
} |
710 |
padding-bottom: 1em; |
|
|
711 |
} |
676 |
} |
|
|
677 |
} |
712 |
|
678 |
|
713 |
|
679 |
.dt-length, |
714 |
|
680 |
.dt-paging, |
|
|
681 |
.dt-search { |
715 |
input { |
682 |
input { |
716 |
&[type="search"] { |
683 |
&[type="search"] { |
717 |
border: 1px solid #CCC; |
684 |
border: 1px solid #CCC; |
Lines 748-834
div {
Link Here
|
748 |
} |
715 |
} |
749 |
} |
716 |
} |
750 |
|
717 |
|
751 |
.table_entries { |
718 |
@media only screen and ( min-width: 950px ) and ( max-width: 1525px ) { |
752 |
clear: both; |
|
|
753 |
display: flex; |
754 |
} |
755 |
|
756 |
.table_controls { |
757 |
border-top: 1px solid #EEE; |
758 |
display: flex; |
759 |
flex-grow: 1; |
760 |
justify-content: flex-end; |
761 |
margin-top: .5em; |
762 |
padding-top: .5em; |
763 |
} |
764 |
|
765 |
@media ( min-width: 1275px ) { |
766 |
.dt-button-text { |
719 |
.dt-button-text { |
767 |
display: inline; |
720 |
display: none; |
768 |
} |
|
|
769 |
|
770 |
div { |
771 |
.dt-container { |
772 |
.dt-paging { |
773 |
.dt-paging-button { |
774 |
&.first, |
775 |
&.last { |
776 |
display: inline-block; |
777 |
} |
778 |
} |
779 |
} |
780 |
} |
781 |
} |
782 |
} |
783 |
|
784 |
@media only screen and ( min-width: 500px ) { |
785 |
div { |
786 |
.dt-container { |
787 |
.dt-length { |
788 |
display: block; |
789 |
} |
790 |
} |
791 |
} |
721 |
} |
792 |
} |
722 |
} |
793 |
|
723 |
|
794 |
@media only screen and ( max-width: 767px ) { |
724 |
@media ( min-width: 1390 ) { |
795 |
div { |
725 |
.dt-layout-row { |
796 |
.dt-container { |
726 |
flex-wrap: wrap; |
797 |
.dt-info, |
|
|
798 |
.dt-paging { |
799 |
float: none; |
800 |
text-align: left; |
801 |
} |
802 |
} |
803 |
} |
727 |
} |
804 |
} |
|
|
805 |
|
728 |
|
806 |
@media only screen and ( min-width: 950px ) and ( max-width: 1125px ) { |
|
|
807 |
.dt-button-text { |
729 |
.dt-button-text { |
808 |
display: none; |
730 |
display: inline; |
809 |
} |
|
|
810 |
} |
811 |
|
812 |
@media only screen and ( min-width: 950px ) { |
813 |
.table_entries, |
814 |
.table_controls { |
815 |
border-top: 0; |
816 |
clear: none; |
817 |
margin: 0; |
818 |
padding: 0; |
819 |
} |
731 |
} |
820 |
} |
732 |
} |
821 |
|
733 |
|
822 |
@media only screen and ( min-width: 1500px ) { |
734 |
@media screen and ( max-width: 767px ) { |
823 |
div { |
735 |
div.dt-container { |
824 |
.dt-container { |
736 |
div.dt-layout-row:not( .dt-layout-table ) { |
825 |
.dt-paging { |
737 |
div.dt-layout-cell { |
826 |
span { |
738 |
text-align: left; |
827 |
.dt-paging-button, |
|
|
828 |
.ellipsis { |
829 |
display: inline-block; |
830 |
} |
831 |
} |
832 |
} |
739 |
} |
833 |
} |
740 |
} |
834 |
} |
741 |
} |