mediawiki-skins-Citizen/skinStyles/extensions/SemanticResultFormats/jquery/jquery.dataTables.less

/*
 * Citizen - SRF / ONOI jQuery dataTables
 * https://starcitizen.tools
 * TODO
*/

@import '../../../../resources/variables.less';

.skin-citizen-dark {
	table.dataTable thead th,
	table.dataTable thead td {
		border-bottom: 1px solid var( --color-surface-0 );
	}

	table.dataTable tfoot th,
	table.dataTable tfoot td {
		border-top: 1px solid var( --color-surface-0 );
	}

	table.dataTable tbody tr {
		background-color: var( --color-surface-0 );
	}

	table.dataTable tbody tr.selected {
		background-color: #b0bed9;
	}

	table.dataTable.row-border tbody th,
	table.dataTable.row-border tbody td,
	table.dataTable.display tbody th,
	table.dataTable.display tbody td {
		border-top: 1px solid @dark-bg-20;
	}

	table.dataTable.cell-border tbody th,
	table.dataTable.cell-border tbody td {
		border-top: 1px solid @dark-bg-20;
		border-right: 1px solid @dark-bg-20;
	}

	table.dataTable.cell-border tbody tr th:first-child,
	table.dataTable.cell-border tbody tr td:first-child {
		border-left: 1px solid @dark-bg-20;
	}

	table.dataTable.stripe tbody tr.odd,
	table.dataTable.display tbody tr.odd {
		background-color: @dark-bg-10;
	}

	table.dataTable.stripe tbody tr.odd.selected,
	table.dataTable.display tbody tr.odd.selected {
		background-color: #acbad4;
	}

	table.dataTable.hover tbody tr:hover,
	table.dataTable.display tbody tr:hover {
		background-color: @dark-bg-20;
	}

	table.dataTable.hover tbody tr:hover.selected,
	table.dataTable.display tbody tr:hover.selected {
		background-color: #aab7d1;
	}

	table.dataTable.order-column tbody tr > .sorting_1,
	table.dataTable.order-column tbody tr > .sorting_2,
	table.dataTable.order-column tbody tr > .sorting_3,
	table.dataTable.display tbody tr > .sorting_1,
	table.dataTable.display tbody tr > .sorting_2,
	table.dataTable.display tbody tr > .sorting_3 {
		background-color: var( --color-surface-0 );
	}

	table.dataTable.order-column tbody tr.selected > .sorting_1,
	table.dataTable.order-column tbody tr.selected > .sorting_2,
	table.dataTable.order-column tbody tr.selected > .sorting_3,
	table.dataTable.display tbody tr.selected > .sorting_1,
	table.dataTable.display tbody tr.selected > .sorting_2,
	table.dataTable.display tbody tr.selected > .sorting_3 {
		background-color: #acbad5;
	}

	table.dataTable.display tbody tr.odd > .sorting_1,
	table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
		background-color: #f1f1f1;
	}

	table.dataTable.display tbody tr.odd > .sorting_2,
	table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
		background-color: #f3f3f3;
	}

	table.dataTable.display tbody tr.odd > .sorting_3,
	table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
		background-color: #f5f5f5;
	}

	table.dataTable.display tbody tr.odd.selected > .sorting_1,
	table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
		background-color: #a6b4cd;
	}

	table.dataTable.display tbody tr.odd.selected > .sorting_2,
	table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
		background-color: #a8b5cf;
	}

	table.dataTable.display tbody tr.odd.selected > .sorting_3,
	table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
		background-color: #a9b7d1;
	}

	table.dataTable.display tbody tr.even > .sorting_1,
	table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
		background-color: #fafafa;
	}

	table.dataTable.display tbody tr.even > .sorting_2,
	table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
		background-color: #fcfcfc;
	}

	table.dataTable.display tbody tr.even > .sorting_3,
	table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
		background-color: #fefefe;
	}

	table.dataTable.display tbody tr.even.selected > .sorting_1,
	table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
		background-color: #acbad5;
	}

	table.dataTable.display tbody tr.even.selected > .sorting_2,
	table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
		background-color: #aebcd6;
	}

	table.dataTable.display tbody tr.even.selected > .sorting_3,
	table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
		background-color: #afbdd8;
	}

	table.dataTable.display tbody tr:hover > .sorting_1,
	table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
		background-color: #eaeaea;
	}

	table.dataTable.display tbody tr:hover > .sorting_2,
	table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
		background-color: #ececec;
	}

	table.dataTable.display tbody tr:hover > .sorting_3,
	table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
		background-color: #efefef;
	}

	table.dataTable.display tbody tr:hover.selected > .sorting_1,
	table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
		background-color: #a2aec7;
	}

	table.dataTable.display tbody tr:hover.selected > .sorting_2,
	table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
		background-color: #a3b0c9;
	}

	table.dataTable.display tbody tr:hover.selected > .sorting_3,
	table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
		background-color: #a5b2cb;
	}

	table.dataTable.no-footer {
		border-bottom: 1px solid var( --color-surface-0 );
	}

	.dataTables_wrapper .dataTables_paginate .paginate_button {
		color: var( --color-base );
	}

	.dataTables_wrapper .dataTables_paginate .paginate_button.current,
	.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
		color: var( --color-base );
		background: var( --color-surface-0 ) linear-gradient( to bottom, var( --color-surface-0 ) 0%, @dark-bg-20 100% );
		border: 1px solid @dark-bg-50;
	}

	.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
	.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
	.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
		color: var( --color-base--subtle );
	}

	.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
		color: var( --color-base--emphasized );
		background: @dark-bg-20 linear-gradient( to bottom, @dark-bg-20 0%, var( --color-surface-0 ) 100% );
		border: 1px solid var( --color-surface-0 );
	}

	.dataTables_wrapper .dataTables_paginate .paginate_button:active {
		background: @dark-bg-20 linear-gradient( to bottom, @dark-bg-20 0%, var( --color-surface-0 ) 100% );
		box-shadow: inset 0 0 3px var( --color-surface-0 );
	}

	.dataTables_wrapper .dataTables_processing {
		background: var( --color-surface-0 ) linear-gradient( to right, rgba( 0, 0, 0, 0 ) 0%, rgba( 0, 0, 0, 0.9 ) 25%, rgba( 0, 0, 0, 0.9 ) 75%, rgba( 0, 0, 0, 0 ) 100% );
	}

	.dataTables_wrapper .dataTables_length,
	.dataTables_wrapper .dataTables_filter,
	.dataTables_wrapper .dataTables_info,
	.dataTables_wrapper .dataTables_processing,
	.dataTables_wrapper .dataTables_paginate {
		color: var( --color-base );
	}

	.dataTables_wrapper.no-footer .dataTables_scrollBody {
		border-bottom: 1px solid var( --color-surface-0 );
	}
}