rooty/DataTables
1
0
Fork 0
mirror of https://github.com/DataTables/DataTables.git synced 2025-02-27 00:54:15 +01:00
Code Issues Releases Activity

New: CSS - Add .selected option to CSS for selected rows

Browse Source 
- It is quite common to have a row selection styling in DataTables, so
  it makes sense to built this ability directly into the core CSS. It
  doesn't add too much extra weight, but it would be a huge pain for
  developers to do themselves and also it means I can reuse it in
  TableTools / Editor.
This commit is contained in:
Allan Jardine 2013-08-06 17:18:56 +01:00
parent 4c317c910a
commit dd805f6623
2 changed files with 60 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.datatables-commit-sync
View File

@ -1 +1 @@
8d58eb8d41b41bdc0a7cf0fdca4178d0933158d2
f5cbd047f7f47a79c5ab8a25953483ad0b190677

59
media/css/jquery.dataTables.css
View File

@ -94,9 +94,15 @@ table.dataTable.cell-border tbody tr:last-child td {
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
background-color: #f9f9f9;
}
table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
background-color: #abb9d3;
}
table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
background-color: white;
}
table.dataTable.stripe tbody tr.even.selected, table.dataTable.display tbody tr.even.selected {
background-color: #b0bed9;
}
table.dataTable.hover tbody tr:hover,
table.dataTable.hover tbody tr.odd:hover,
table.dataTable.hover tbody tr.even:hover, table.dataTable.display tbody tr:hover,
@ -104,6 +110,13 @@ table.dataTable.display tbody tr.odd:hover,
table.dataTable.display tbody tr.even:hover {
background-color: whitesmoke;
}
table.dataTable.hover tbody tr:hover.selected,
table.dataTable.hover tbody tr.odd:hover.selected,
table.dataTable.hover tbody tr.even:hover.selected, table.dataTable.display tbody tr:hover.selected,
table.dataTable.display tbody tr.odd:hover.selected,
table.dataTable.display tbody tr.even:hover.selected {
background-color: #a9b7d1;
}
table.dataTable.sort-column tbody tr > .sorting_1,
table.dataTable.sort-column tbody tr > .sorting_2,
table.dataTable.sort-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1,
@ -111,6 +124,13 @@ table.dataTable.display tbody tr > .sorting_2,
table.dataTable.display tbody tr > .sorting_3 {
background-color: #f9f9f9;
}
table.dataTable.sort-column tbody tr.selected > .sorting_1,
table.dataTable.sort-column tbody tr.selected > .sorting_2,
table.dataTable.sort-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: #acbad4;
}
table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.sort-column.stripe tbody tr.odd > .sorting_1 {
background-color: #f1f1f1;
}
@ -120,6 +140,15 @@ table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.sort-column.s
table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.sort-column.stripe tbody tr.odd > .sorting_3 {
background-color: whitesmoke;
}
table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.sort-column.stripe tbody tr.odd.selected > .sorting_1 {
background-color: #a6b3cd;
}
table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.sort-column.stripe tbody tr.odd.selected > .sorting_2 {
background-color: #a7b5ce;
}
table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.sort-column.stripe tbody tr.odd.selected > .sorting_3 {
background-color: #a9b6d0;
}
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.sort-column.stripe tbody tr.even > .sorting_1 {
background-color: #f9f9f9;
}
@ -129,6 +158,15 @@ table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.sort-column.
table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.sort-column.stripe tbody tr.even > .sorting_3 {
background-color: #fdfdfd;
}
table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.sort-column.stripe tbody tr.even.selected > .sorting_1 {
background-color: #acbad4;
}
table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.sort-column.stripe tbody tr.even.selected > .sorting_2 {
background-color: #adbbd6;
}
table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.sort-column.stripe tbody tr.even.selected > .sorting_3 {
background-color: #afbdd8;
}
table.dataTable.display tbody tr:hover > .sorting_1,
table.dataTable.display tbody tr.odd:hover > .sorting_1,
table.dataTable.display tbody tr.even:hover > .sorting_1, table.dataTable.sort-column.hover tbody tr:hover > .sorting_1,
@ -150,6 +188,27 @@ table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_3,
table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_3 {
background-color: #eeeeee;
}
table.dataTable.display tbody tr:hover.selected > .sorting_1,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_1,
table.dataTable.display tbody tr.even:hover.selected > .sorting_1, table.dataTable.sort-column.hover tbody tr:hover.selected > .sorting_1,
table.dataTable.sort-column.hover tbody tr.odd:hover.selected > .sorting_1,
table.dataTable.sort-column.hover tbody tr.even:hover.selected > .sorting_1 {
background-color: #a1aec7;
}
table.dataTable.display tbody tr:hover.selected > .sorting_2,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_2,
table.dataTable.display tbody tr.even:hover.selected > .sorting_2, table.dataTable.sort-column.hover tbody tr:hover.selected > .sorting_2,
table.dataTable.sort-column.hover tbody tr.odd:hover.selected > .sorting_2,
table.dataTable.sort-column.hover tbody tr.even:hover.selected > .sorting_2 {
background-color: #a2afc8;
}
table.dataTable.display tbody tr:hover.selected > .sorting_3,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_3,
table.dataTable.display tbody tr.even:hover.selected > .sorting_3, table.dataTable.sort-column.hover tbody tr:hover.selected > .sorting_3,
table.dataTable.sort-column.hover tbody tr.odd:hover.selected > .sorting_3,
table.dataTable.sort-column.hover tbody tr.even:hover.selected > .sorting_3 {
background-color: #a4b2cb;
}
/*
* Control feature layout