|
Tags: Blanking Manual revert |
| Line 1: |
Line 1: |
| /* =========================================
| |
| SMW Datatables global styling
| |
| Applies to all format=datatables outputs
| |
| wiki-wide, regardless of context.
| |
|
| |
|
| Add this to MediaWiki:Common.css
| |
| ========================================= */
| |
|
| |
| /* ----- Container ----- */
| |
| .datatables-container {
| |
| font-size: 0.875rem;
| |
| color: #1a1a1a;
| |
| }
| |
|
| |
| /* ----- Controls (length + search) ----- */
| |
| .dt-length,
| |
| .dt-search {
| |
| font-size: 0.82rem;
| |
| color: #555;
| |
| padding: 0.5rem 0 0.25rem;
| |
| }
| |
|
| |
| .dt-input {
| |
| border: 1px solid #e8e5e1;
| |
| border-radius: 0.5rem;
| |
| padding: 0.25rem 0.6rem;
| |
| font-size: 0.82rem;
| |
| color: #1a1a1a;
| |
| background: #ffffff;
| |
| outline: none;
| |
| transition: border-color 0.15s ease;
| |
| }
| |
|
| |
| .dt-input:focus {
| |
| border-color: #aaa;
| |
| }
| |
|
| |
| /* ----- Table base ----- */
| |
| .srf-datatable {
| |
| border-collapse: collapse !important;
| |
| border: none !important;
| |
| width: 100% !important;
| |
| margin: 0 !important;
| |
| }
| |
|
| |
| /* ----- Header ----- */
| |
| .srf-datatable thead th {
| |
| background: #faf9f7 !important;
| |
| font-size: 0.82rem !important;
| |
| font-weight: 500 !important;
| |
| color: #555 !important;
| |
| border-bottom: 2px solid #e8e5e1 !important;
| |
| border-top: none !important;
| |
| border-left: none !important;
| |
| border-right: none !important;
| |
| padding: 0.5rem 0.75rem !important;
| |
| white-space: nowrap;
| |
| }
| |
|
| |
| /* ----- Sort icons ----- */
| |
| .srf-datatable thead th .dt-column-order::before,
| |
| .srf-datatable thead th .dt-column-order::after {
| |
| opacity: 0.3;
| |
| }
| |
|
| |
| .srf-datatable thead th.dt-ordering-asc .dt-column-order::before,
| |
| .srf-datatable thead th.dt-ordering-desc .dt-column-order::after {
| |
| opacity: 0.7;
| |
| }
| |
|
| |
| /* ----- Rows ----- */
| |
| .srf-datatable tbody tr {
| |
| border-bottom: 1px solid #f0eeeb !important;
| |
| transition: background 0.15s ease;
| |
| }
| |
|
| |
| .srf-datatable tbody tr:last-child {
| |
| border-bottom: none !important;
| |
| }
| |
|
| |
| .srf-datatable tbody tr:hover {
| |
| background: #faf9f7 !important;
| |
| }
| |
|
| |
| .srf-datatable tbody td {
| |
| font-size: 0.875rem !important;
| |
| color: #1a1a1a !important;
| |
| border: none !important;
| |
| padding: 0.5rem 0.75rem !important;
| |
| vertical-align: middle;
| |
| }
| |
|
| |
| /* ----- Links ----- */
| |
| .srf-datatable tbody td a {
| |
| color: #2c5f8a;
| |
| text-decoration: none;
| |
| border-bottom: 1px solid transparent;
| |
| transition: border-color 0.15s ease, color 0.15s ease;
| |
| }
| |
|
| |
| .srf-datatable tbody td a:hover {
| |
| color: #1a4266;
| |
| border-bottom-color: #2c5f8a;
| |
| }
| |
|
| |
| /* ----- Footer info ----- */
| |
| .dt-info {
| |
| font-size: 0.78rem;
| |
| color: #999;
| |
| padding-top: 0.5rem;
| |
| }
| |
|
| |
| /* ----- Pagination ----- */
| |
| .dt-paging {
| |
| padding-top: 0.375rem;
| |
| }
| |
|
| |
| .dt-paging-button {
| |
| border: 1px solid #e8e5e1 !important;
| |
| border-radius: 0.375rem !important;
| |
| background: #ffffff !important;
| |
| color: #555 !important;
| |
| font-size: 0.78rem !important;
| |
| padding: 0.2rem 0.6rem !important;
| |
| margin: 0 0.1rem !important;
| |
| cursor: pointer;
| |
| transition: background 0.15s ease, border-color 0.15s ease;
| |
| }
| |
|
| |
| .dt-paging-button:hover:not(.disabled) {
| |
| background: #faf9f7 !important;
| |
| border-color: #aaa !important;
| |
| color: #1a1a1a !important;
| |
| }
| |
|
| |
| .dt-paging-button.current {
| |
| background: #faf9f7 !important;
| |
| border-color: #aaa !important;
| |
| color: #1a1a1a !important;
| |
| font-weight: 600 !important;
| |
| }
| |
|
| |
| .dt-paging-button.disabled {
| |
| opacity: 0.35 !important;
| |
| cursor: default !important;
| |
| }
| |
|
| |
| /* ----- Spinner ----- */
| |
| .datatables-spinner {
| |
| display: none !important;
| |
| }
| |
|
| |
| /* ----- Responsive expand control ----- */
| |
| .srf-datatable tbody td.dtr-control::before {
| |
| border-color: #555 !important;
| |
| background: #555 !important;
| |
| }
| |