|
Tags: Blanking Manual revert |
(10 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| /* =============================
| |
| General Table Styling
| |
| ============================= */
| |
| table.srf-datatable {
| |
| width: 100% !important;
| |
| margin-bottom: 1rem;
| |
| color: #212529;
| |
| background-color: #fff;
| |
| border-collapse: collapse;
| |
| }
| |
|
| |
|
| table.srf-datatable thead th {
| |
| vertical-align: bottom;
| |
| border-bottom: 2px solid #dee2e6;
| |
| background-color: #f8f9fa;
| |
| font-weight: 600;
| |
| padding: 0.75rem;
| |
| }
| |
|
| |
| table.srf-datatable tbody td {
| |
| border-top: 1px solid #dee2e6;
| |
| padding: 0.75rem;
| |
| }
| |
|
| |
| table.srf-datatable tbody tr:nth-child(even) {
| |
| background-color: #f2f2f2;
| |
| }
| |
|
| |
| table.srf-datatable tbody tr:hover {
| |
| background-color: #e9ecef;
| |
| }
| |
|
| |
| /* =============================
| |
| Paging Controls
| |
| ============================= */
| |
| div.srf-datatable-wrapper .dataTables_paginate {
| |
| display: flex;
| |
| justify-content: flex-end;
| |
| padding: 0.75rem;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_paginate .paginate_button {
| |
| font-size: 0.875rem;
| |
| color: #007bff !important;
| |
| background-color: #fff;
| |
| border: 1px solid #dee2e6;
| |
| padding: 0.375rem 0.75rem;
| |
| margin-left: 0.25rem;
| |
| border-radius: 0.25rem;
| |
| cursor: pointer;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_paginate .paginate_button.current,
| |
| div.srf-datatable-wrapper .dataTables_paginate .paginate_button.current:hover {
| |
| background-color: #007bff;
| |
| color: #fff !important;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_paginate .paginate_button:hover {
| |
| background-color: #e2e6ea;
| |
| }
| |
|
| |
| /* =============================
| |
| Info Text (e.g., "Showing 1 to 10 of 100 entries")
| |
| ============================= */
| |
| div.srf-datatable-wrapper .dataTables_info {
| |
| padding: 0.75rem;
| |
| font-size: 0.875rem;
| |
| color: #6c757d;
| |
| }
| |
|
| |
| /* =============================
| |
| Search Filter
| |
| ============================= */
| |
| div.srf-datatable-wrapper .dataTables_filter {
| |
| float: right;
| |
| padding: 0.75rem;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_filter label {
| |
| font-size: 0.875rem;
| |
| color: #495057;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_filter input {
| |
| margin-left: 0.5rem;
| |
| display: inline-block;
| |
| width: auto;
| |
| padding: 0.375rem 0.75rem;
| |
| font-size: 0.875rem;
| |
| line-height: 1.5;
| |
| color: #495057;
| |
| background-color: #fff;
| |
| background-clip: padding-box;
| |
| border: 1px solid #ced4da;
| |
| border-radius: 0.25rem;
| |
| }
| |
|
| |
| /* =============================
| |
| Length Selector (dropdown)
| |
| ============================= */
| |
| div.srf-datatable-wrapper .dataTables_length {
| |
| float: left;
| |
| padding: 0.75rem;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_length label {
| |
| font-size: 0.875rem;
| |
| color: #495057;
| |
| }
| |
|
| |
| div.srf-datatable-wrapper .dataTables_length select {
| |
| margin-left: 0.5rem;
| |
| display: inline-block;
| |
| width: auto;
| |
| padding: 0.375rem 0.75rem;
| |
| font-size: 0.875rem;
| |
| line-height: 1.5;
| |
| color: #495057;
| |
| background-color: #fff;
| |
| border: 1px solid #ced4da;
| |
| border-radius: 0.25rem;
| |
| }
| |
|
| |
| /* =============================
| |
| Sorting Icons (Optional enhancement)
| |
| ============================= */
| |
| table.srf-datatable thead th.sorting:after,
| |
| table.srf-datatable thead th.sorting_asc:after,
| |
| table.srf-datatable thead th.sorting_desc:after {
| |
| content: "";
| |
| float: right;
| |
| margin-left: 0.5rem;
| |
| }
| |
|
| |
| table.srf-datatable thead th.sorting:after {
| |
| content: "\f0dc";
| |
| font-family: "Font Awesome 5 Free";
| |
| font-weight: 900;
| |
| color: #6c757d;
| |
| }
| |
|
| |
| table.srf-datatable thead th.sorting_asc:after {
| |
| content: "\f0de";
| |
| font-family: "Font Awesome 5 Free";
| |
| font-weight: 900;
| |
| color: #007bff;
| |
| }
| |
|
| |
| table.srf-datatable thead th.sorting_desc:after {
| |
| content: "\f0dd";
| |
| font-family: "Font Awesome 5 Free";
| |
| font-weight: 900;
| |
| color: #007bff;
| |
| }
| |