Файл: datatables/media/css/demo_table_jui.css
Строк: 282
/*
* File: demo_table_jui.css
* CVS: $Id$
*
Description: CSS descriptions for DataTables demo pages
* Author:
Allan Jardine
* Created: Tue May 12 06:47:22 BST 2009
* Modified:
$Date$ by $Author$
* Language: CSS
* Project: DataTables
*
* Copyright 2009 Allan Jardine. All Rights Reserved.
*
*
***************************************************************************
* DESCRIPTION
*
* The styles given here are suitable for the demos that
are used with the standard DataTables
* distribution (see
www.datatables.net). You will most likely wish to modify these styles to
*
meet the layout requirements of your site.
*
* Common issues:
*
'full_numbers' pagination - I use an extra selector on the body tag to
ensure that there is
* no conflict between the two pagination types.
If you want to use full_numbers pagination
* ensure that you either
have "example_alt_pagination" as a body class name, or better
yet,
* modify that selector.
* Note that the path used for Images
is relative. All images are by default located in
* ../images/ -
relative to this CSS file.
*/
/*
* jQuery UI specific styling
*/
.paging_two_button .ui-button {
float: left;
cursor: pointer;
*
cursor: hand;
}
.paging_full_numbers .ui-button {
padding: 2px
6px;
margin: 0;
cursor: pointer;
* cursor: hand;
color: #333
!important;
}
.dataTables_paginate .ui-button {
margin-right: -0.1em
!important;
}
.paging_full_numbers {
width: 350px
!important;
}
.dataTables_wrapper .ui-toolbar {
padding:
5px;
}
.dataTables_paginate {
width: auto;
}
.dataTables_info
{
padding-top: 3px;
}
table.display thead th {
padding: 3px 0px 3px
10px;
cursor: pointer;
* cursor: hand;
}
div.dataTables_wrapper
.ui-widget-header {
font-weight: normal;
}
/*
* Sort arrow icon
positioning
*/
table.display thead th div.DataTables_sort_wrapper
{
position: relative;
padding-right: 20px;
}
table.display thead th
div.DataTables_sort_wrapper span {
position: absolute;
top:
50%;
margin-top: -8px;
right: 0;
}
/* * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * *
*
* Everything below this line is
the same as demo_table.css. This file is
* required for 'cleanliness' of
the markup
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * *
* DataTables features
*/
.dataTables_wrapper
{
position: relative;
clear: both;
}
.dataTables_processing {
position:
absolute;
top: 0px;
left: 50%;
width: 250px;
margin-left:
-125px;
border: 1px solid #ddd;
text-align: center;
color:
#999;
font-size: 11px;
padding: 2px 0;
}
.dataTables_length {
width:
40%;
float: left;
}
.dataTables_filter {
width: 50%;
float:
right;
text-align: right;
}
.dataTables_info {
width: 50%;
float:
left;
}
.dataTables_paginate {
float: right;
text-align: right;
}
/*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
DataTables display
*/
table.display {
margin: 0 auto;
width:
100%;
clear: both;
border-collapse: collapse;
}
table.display tfoot th
{
padding: 3px 0px 3px 10px;
font-weight: bold;
font-weight:
normal;
}
table.display tr.heading2 td {
border-bottom: 1px solid
#aaa;
}
table.display td {
padding: 3px 10px;
}
table.display td.center
{
text-align: center;
}
/* * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * *
* DataTables sorting
*/
.sorting_asc
{
background: url('../images/sort_asc.png') no-repeat center
right;
}
.sorting_desc {
background: url('../images/sort_desc.png')
no-repeat center right;
}
.sorting {
background:
url('../images/sort_both.png') no-repeat center
right;
}
.sorting_asc_disabled {
background:
url('../images/sort_asc_disabled.png') no-repeat center
right;
}
.sorting_desc_disabled {
background:
url('../images/sort_desc_disabled.png') no-repeat center right;
}
/* *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
DataTables row classes
*/
table.display tr.odd.gradeA {
background-color:
#ddffdd;
}
table.display tr.even.gradeA {
background-color:
#eeffee;
}
table.display tr.odd.gradeA {
background-color:
#ddffdd;
}
table.display tr.even.gradeA {
background-color:
#eeffee;
}
table.display tr.odd.gradeC {
background-color:
#ddddff;
}
table.display tr.even.gradeC {
background-color:
#eeeeff;
}
table.display tr.odd.gradeX {
background-color:
#ffdddd;
}
table.display tr.even.gradeX {
background-color:
#ffeeee;
}
table.display tr.odd.gradeU {
background-color:
#ddd;
}
table.display tr.even.gradeU {
background-color: #eee;
}
tr.odd
{
background-color: #E2E4FF;
}
tr.even {
background-color:
white;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * *
* Misc
*/
.dataTables_scroll {
clear:
both;
}
.dataTables_scrollBody {
-webkit-overflow-scrolling:
touch;
}
.top, .bottom {
padding: 15px;
background-color:
#F5F5F5;
border: 1px solid #CCCCCC;
}
.top .dataTables_info {
float:
none;
}
.clear {
clear: both;
}
.dataTables_empty {
text-align:
center;
}
tfoot input {
margin: 0.5em 0;
width: 100%;
color:
#444;
}
tfoot input.search_init {
color: #999;
}
td.group
{
background-color: #d1cfd0;
border-bottom: 2px solid
#A19B9E;
border-top: 2px solid #A19B9E;
}
td.details {
background-color:
#d1cfd0;
border: 2px solid #A19B9E;
}
.example_alt_pagination
div.dataTables_info {
width: 40%;
}
.paging_full_numbers
a.paginate_button,
.paging_full_numbers a.paginate_active {
border: 1px
solid #aaa;
-webkit-border-radius: 5px;
-moz-border-radius:
5px;
padding: 2px 5px;
margin: 0 3px;
cursor: pointer;
*cursor:
hand;
color: #333 !important;
}
.paging_full_numbers a.paginate_button
{
background-color: #ddd;
}
.paging_full_numbers a.paginate_button:hover
{
background-color: #ccc;
text-decoration: none
!important;
}
.paging_full_numbers a.paginate_active {
background-color:
#99B3FF;
}
table.display tr.even.row_selected td {
background-color:
#B0BED9;
}
table.display tr.odd.row_selected td {
background-color:
#9FAFD1;
}
/*
* Sorting classes for columns
*/
/* For the standard
odd/even */
tr.odd td.sorting_1 {
background-color: #D3D6FF;
}
tr.odd
td.sorting_2 {
background-color: #DADCFF;
}
tr.odd td.sorting_3
{
background-color: #E0E2FF;
}
tr.even td.sorting_1 {
background-color:
#EAEBFF;
}
tr.even td.sorting_2 {
background-color: #F2F3FF;
}
tr.even
td.sorting_3 {
background-color: #F9F9FF;
}
/* For the Conditional-CSS
grading rows */
/*
Colour calculations (based off the main row colours)
Level 1:
dd > c4
ee > d5
Level 2:
dd > d1
ee > e2
*/
tr.odd.gradeA td.sorting_1 {
background-color:
#c4ffc4;
}
tr.odd.gradeA td.sorting_2 {
background-color:
#d1ffd1;
}
tr.odd.gradeA td.sorting_3 {
background-color:
#d1ffd1;
}
tr.even.gradeA td.sorting_1 {
background-color:
#d5ffd5;
}
tr.even.gradeA td.sorting_2 {
background-color:
#e2ffe2;
}
tr.even.gradeA td.sorting_3 {
background-color:
#e2ffe2;
}
tr.odd.gradeC td.sorting_1 {
background-color:
#c4c4ff;
}
tr.odd.gradeC td.sorting_2 {
background-color:
#d1d1ff;
}
tr.odd.gradeC td.sorting_3 {
background-color:
#d1d1ff;
}
tr.even.gradeC td.sorting_1 {
background-color:
#d5d5ff;
}
tr.even.gradeC td.sorting_2 {
background-color:
#e2e2ff;
}
tr.even.gradeC td.sorting_3 {
background-color:
#e2e2ff;
}
tr.odd.gradeX td.sorting_1 {
background-color:
#ffc4c4;
}
tr.odd.gradeX td.sorting_2 {
background-color:
#ffd1d1;
}
tr.odd.gradeX td.sorting_3 {
background-color:
#ffd1d1;
}
tr.even.gradeX td.sorting_1 {
background-color:
#ffd5d5;
}
tr.even.gradeX td.sorting_2 {
background-color:
#ffe2e2;
}
tr.even.gradeX td.sorting_3 {
background-color:
#ffe2e2;
}
tr.odd.gradeU td.sorting_1 {
background-color:
#c4c4c4;
}
tr.odd.gradeU td.sorting_2 {
background-color:
#d1d1d1;
}
tr.odd.gradeU td.sorting_3 {
background-color:
#d1d1d1;
}
tr.even.gradeU td.sorting_1 {
background-color:
#d5d5d5;
}
tr.even.gradeU td.sorting_2 {
background-color:
#e2e2e2;
}
tr.even.gradeU td.sorting_3 {
background-color:
#e2e2e2;
}
/*
* Row highlighting example
*/
.ex_highlight #example
tbody tr.even:hover, #example tbody tr.even td.highlighted
{
background-color: #ECFFB3;
}
.ex_highlight #example tbody tr.odd:hover,
#example tbody tr.odd td.highlighted {
background-color: #E6FF99;
}