1
0
mirror of https://github.com/DataTables/DataTables.git synced 2025-03-15 16:29:16 +01:00

New - CSS: Add 'display' class to the options list.

- 'display' is a short cut for using the classes: 'hover stripe
  row-border sort-column'
This commit is contained in:
Allan Jardine 2013-06-15 09:22:16 +01:00
parent fe390220cf
commit 11591f4894
2 changed files with 34 additions and 23 deletions

View File

@ -1,7 +1,3 @@
/*
* THIS IS A GENREATED FILE FROM jquery.dataTables.scss
*/
/* /*
* Table styles * Table styles
*/ */
@ -58,10 +54,11 @@ table.dataTable {
table.dataTable th.right, table.dataTable th.right,
table.dataTable td.right { table.dataTable td.right {
text-align: right; } text-align: right; }
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td { 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 #dddddd; } border-top: 1px solid #dddddd; }
table.dataTable.row-border tbody tr:first-child th, table.dataTable.row-border tbody tr:first-child th,
table.dataTable.row-border tbody tr:first-child td { table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th,
table.dataTable.display tbody tr:first-child td {
border-top: none; } border-top: none; }
table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td { table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
border-top: 1px solid #dddddd; border-top: 1px solid #dddddd;
@ -74,41 +71,51 @@ table.dataTable {
table.dataTable.cell-border tbody tr:last-child th, table.dataTable.cell-border tbody tr:last-child th,
table.dataTable.cell-border tbody tr:last-child td { table.dataTable.cell-border tbody tr:last-child td {
border-top: none; } border-top: none; }
table.dataTable.stripe tr.odd { table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
background-color: #f9f9f9; } background-color: #f9f9f9; }
table.dataTable.stripe tr.even { table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
background-color: white; } background-color: white; }
table.dataTable.hover tbody tr:hover, table.dataTable.hover tbody tr:hover,
table.dataTable.hover tbody tr.odd:hover, table.dataTable.hover tbody tr.odd:hover,
table.dataTable.hover tbody tr.even:hover { table.dataTable.hover tbody tr.even:hover, table.dataTable.display tbody tr:hover,
table.dataTable.display tbody tr.odd:hover,
table.dataTable.display tbody tr.even:hover {
background-color: whitesmoke; } background-color: whitesmoke; }
table.dataTable.sort-column tbody tr > .sorting_1, table.dataTable.sort-column tbody tr > .sorting_1,
table.dataTable.sort-column tbody tr > .sorting_2, table.dataTable.sort-column tbody tr > .sorting_2,
table.dataTable.sort-column tbody tr > .sorting_3 { table.dataTable.sort-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: #f9f9f9; } background-color: #f9f9f9; }
table.dataTable.sort-column.stripe tbody tr.odd > .sorting_1 { table.dataTable.sort-column.stripe tbody tr.odd > .sorting_1, table.dataTable.display.stripe tbody tr.odd > .sorting_1 {
background-color: #f1f1f1; } background-color: #f1f1f1; }
table.dataTable.sort-column.stripe tbody tr.odd > .sorting_2 { table.dataTable.sort-column.stripe tbody tr.odd > .sorting_2, table.dataTable.display.stripe tbody tr.odd > .sorting_2 {
background-color: #f3f3f3; } background-color: #f3f3f3; }
table.dataTable.sort-column.stripe tbody tr.odd > .sorting_3 { table.dataTable.sort-column.stripe tbody tr.odd > .sorting_3, table.dataTable.display.stripe tbody tr.odd > .sorting_3 {
background-color: whitesmoke; } background-color: whitesmoke; }
table.dataTable.sort-column.stripe tbody tr.even > .sorting_1 { table.dataTable.sort-column.stripe tbody tr.even > .sorting_1, table.dataTable.display.stripe tbody tr.even > .sorting_1 {
background-color: #f9f9f9; } background-color: #f9f9f9; }
table.dataTable.sort-column.stripe tbody tr.even > .sorting_2 { table.dataTable.sort-column.stripe tbody tr.even > .sorting_2, table.dataTable.display.stripe tbody tr.even > .sorting_2 {
background-color: #fbfbfb; } background-color: #fbfbfb; }
table.dataTable.sort-column.stripe tbody tr.even > .sorting_3 { table.dataTable.sort-column.stripe tbody tr.even > .sorting_3, table.dataTable.display.stripe tbody tr.even > .sorting_3 {
background-color: #fdfdfd; } background-color: #fdfdfd; }
table.dataTable.sort-column.hover tbody tr:hover > .sorting_1, table.dataTable.sort-column.hover tbody tr:hover > .sorting_1,
table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_1, table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_1,
table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_1 { table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_1, table.dataTable.display.hover tbody tr:hover > .sorting_1,
table.dataTable.display.hover tbody tr.odd:hover > .sorting_1,
table.dataTable.display.hover tbody tr.even:hover > .sorting_1 {
background-color: #eaeaea; } background-color: #eaeaea; }
table.dataTable.sort-column.hover tbody tr:hover > .sorting_2, table.dataTable.sort-column.hover tbody tr:hover > .sorting_2,
table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_2, table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_2,
table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_2 { table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_2, table.dataTable.display.hover tbody tr:hover > .sorting_2,
table.dataTable.display.hover tbody tr.odd:hover > .sorting_2,
table.dataTable.display.hover tbody tr.even:hover > .sorting_2 {
background-color: #ebebeb; } background-color: #ebebeb; }
table.dataTable.sort-column.hover tbody tr:hover > .sorting_3, table.dataTable.sort-column.hover tbody tr:hover > .sorting_3,
table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_3, table.dataTable.sort-column.hover tbody tr.odd:hover > .sorting_3,
table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_3 { table.dataTable.sort-column.hover tbody tr.even:hover > .sorting_3, table.dataTable.display.hover tbody tr:hover > .sorting_3,
table.dataTable.display.hover tbody tr.odd:hover > .sorting_3,
table.dataTable.display.hover tbody tr.even:hover > .sorting_3 {
background-color: #eeeeee; } background-color: #eeeeee; }
/* /*

View File

@ -134,7 +134,8 @@ table.dataTable {
// Stripe classes - add "row-border" class to the table to activate // Stripe classes - add "row-border" class to the table to activate
&.row-border tbody { &.row-border tbody,
&.display tbody {
th, td { th, td {
border-top: $table-body-border; border-top: $table-body-border;
} }
@ -168,7 +169,8 @@ table.dataTable {
// Stripe classes - add "stripe" class to the table to activate // Stripe classes - add "stripe" class to the table to activate
&.stripe { &.stripe tbody,
&.display tbody {
tr.odd { tr.odd {
background-color: shade($table-row-background, 2.35%); // shade by f9 background-color: shade($table-row-background, 2.35%); // shade by f9
} }
@ -179,7 +181,8 @@ table.dataTable {
// Hover classes - add "hover" class to the table to activate // Hover classes - add "hover" class to the table to activate
&.hover tbody { &.hover tbody,
&.display tbody {
tr:hover, tr:hover,
tr.odd:hover, tr.odd:hover,
tr.even:hover { tr.even:hover {
@ -189,7 +192,8 @@ table.dataTable {
// Sort column highlighting - add "hover" class to the table to activate // Sort column highlighting - add "hover" class to the table to activate
&.sort-column { &.sort-column,
&.display {
tbody { tbody {
tr>.sorting_1, tr>.sorting_1,
tr>.sorting_2, tr>.sorting_2,