/* * 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 .fg-button { float: left; cursor: pointer; * cursor: hand; } .paging_full_numbers .fg-button { padding: 2px 6px; margin: 0; cursor: pointer; * cursor: hand; } .dataTables_paginate .ui-button, .dataTables_paginate .fg-button { margin-right: -0.1em !important; } .paging_full_numbers { /*width: 350px !important;*/ width: 49%; } .fg-toolbar { padding: 5px; } .dataTables_paginate { width: auto; } div.dtcontainer table.display thead th { padding: 3px 0px 3px 10px; cursor: pointer; * cursor: hand; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Everything below this line is the same as demo_table.css. This file is * required for 'cleanliness' of the markup * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables features */ div.dtcontainer .dataTables_wrapper { position: relative; /*min-height: 302px;*/ /*_height: 302px;*/ clear: both; } div.dtcontainer .dataTables_wrapper { padding-top:5px; } div.dtcontainer .dataTables_filter { padding-bottom:5px; } div.dtcontainer .datatablefooter { margin-top:5px; overflow: hidden; } div.dtcontainer .dataTables_processing { position: absolute; top: 8px; left: 50%; width: 250px; margin-left: -125px; text-align: center; color: #999; font-size: 11px; padding: 2px 0; } div.dtcontainer .dataTables_length { width: 40%; float: left; } div.dtcontainer .dataTables_filter { width: 50%; float: right; text-align: right; } div.dtcontainer .dataTables_info { width: 270px; float: left; } div.dtcontainer .dataTables_paginate { float: right; text-align: right; } /* Pagination nested */ div.dtcontainer .paginate_disabled_previous, div.dtcontainer .paginate_enabled_previous, div.dtcontainer .paginate_disabled_next, div.dtcontainer .paginate_enabled_next { height: 19px; width: 19px; margin-left: 3px; float: left; } div.dtcontainer .paginate_disabled_previous { background-image: url('../images/back_disabled.jpg'); } div.dtcontainer .paginate_enabled_previous { background-image: url('../images/back_enabled.jpg'); } div.dtcontainer .paginate_disabled_next { background-image: url('../images/forward_disabled.jpg'); } div.dtcontainer .paginate_enabled_next { background-image: url('../images/forward_enabled.jpg'); } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables display */ div.dtcontainer table.display { margin: 0 auto; width: 100%; clear: both; } div.dtcontainer table.display tfoot th { padding: 3px 10px; border-top: 1px solid black; font-weight: bold; } div.dtcontainer table.display tr.heading2 td { border-bottom: 1px solid #aaa; } div.dtcontainer table.display td { padding: 3px 10px; } div.dtcontainer table.display td.center { text-align: center; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables sorting */ div.dtcontainer .sorting_asc { background: url('../images/sort_asc.png') no-repeat center right; } div.dtcontainer .sorting_desc { background: url('../images/sort_desc.png') no-repeat center right; } div.dtcontainer .sorting { background: url('../images/sort_both.png') no-repeat center right; } div.dtcontainer .sorting_asc_disabled { background: url('../images/sort_asc_disabled.png') no-repeat center right; } div.dtcontainer .sorting_desc_disabled { background: url('../images/sort_desc_disabled.png') no-repeat center right; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables row classes */ div.dtcontainer table.display tr.odd.gradeA { background-color: #ddffdd; } div.dtcontainer table.display tr.even.gradeA { background-color: #eeffee; } div.dtcontainer table.display tr.odd.gradeA { background-color: #ddffdd; } div.dtcontainer table.display tr.even.gradeA { background-color: #eeffee; } div.dtcontainer table.display tr.odd.gradeC { background-color: #ddddff; } div.dtcontainer table.display tr.even.gradeC { background-color: #eeeeff; } div.dtcontainer table.display tr.odd.gradeX { background-color: #ffdddd; } div.dtcontainer table.display tr.even.gradeX { background-color: #ffeeee; } div.dtcontainer table.display tr.odd.gradeU { background-color: #ddd; } div.dtcontainer table.display tr.even.gradeU { background-color: #eee; } div.dtcontainer tr { border: 1px solid #ebebeb !important; } div.dtcontainer td { padding: 3px; } div.dtcontainer tr.odd { background-color: #fafafa; } div.dtcontainer tr.even { background-color: white; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Misc */ .dataTables_scroll { clear: both; } div.dtcontainer .top, div.dtcontainer .bottom { padding: 15px; background-color: #F5F5F5; border: 1px solid #CCCCCC; } div.dtcontainer .top .dataTables_info { float: none; } div.dtcontainer .clear { clear: both; } div.dtcontainer .dataTables_empty { text-align: center; } div.dtcontainer tfoot input { margin: 0.5em 0; width: 100%; color: #444; } div.dtcontainer tfoot input.search_init { color: #999; } div.dtcontainer td.group { background-color: #d1cfd0; border-bottom: 2px solid #A19B9E; border-top: 2px solid #A19B9E; } div.dtcontainer td.details { background-color: #d1cfd0; border: 2px solid #A19B9E; } div.dtcontainer .example_alt_pagination div.dataTables_info { width: 40%; } div.dtcontainer .paging_full_numbers span.paginate_button, div.dtcontainer .paging_full_numbers span.paginate_active { border: 1px solid #aaa; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 2px 5px; margin: 0 3px; cursor: pointer; *cursor: hand; } div.dtcontainer .paging_full_numbers span.paginate_button { background-color: #ddd; } div.dtcontainer .paging_full_numbers span.paginate_button:hover { background-color: #ccc; } div.dtcontainer .paging_full_numbers span.paginate_active { background-color: #99B3FF; } div.dtcontainer table.display tr.even.row_selected td { background-color: #B0BED9; } div.dtcontainer table.display tr.odd.row_selected td { background-color: #9FAFD1; } /* * Sorting classes for columns */ /* For the standard odd/even */ div.dtcontainer tr.odd td.sorting_1, div.dtcontainer tr.odd td.sorting_2, div.dtcontainer tr.odd td { background-color: #FAFAFA; } div.dtcontainer tr.even td.sorting_1, div.dtcontainer tr.even td.sorting_2, div.dtcontainer tr.even td { background-color: #FFFFFF; } div.dtcontainer tr.odd td.sorting_1, div.dtcontainer tr.even td.sorting_1 { border: 1px solid #ebebeb; } /* 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 */ /*/*div.dtcontainer tr.odd td.sorting_1 {*/ /*background-color: #c4c4ff;*/ /*}*/ /*/*div.dtcontainer tr.odd td.sorting_2 {*/ /*background-color: #d1d1ff;*/ /*}*/ /*/*div.dtcontainer tr.odd td {*/ /*background-color: #d1d1ff;*/ /*}*/ /*/*div.dtcontainer tr.even td.sorting_1 {*/ /*background-color: #d5d5ff;*/ /*}*/ /*/*div.dtcontainer tr.even td.sorting_2 {*/ /*background-color: #e2e2ff;*/ /*}*/ /*/*div.dtcontainer tr.even td {*/ /*background-color: #e2e2ff;*/ /*}*/ div.dtcontainer tr.odd.gradeC td.sorting_1 { background-color: #c4c4ff; } div.dtcontainer tr.odd.gradeC td.sorting_2 { background-color: #d1d1ff; } div.dtcontainer tr.odd.gradeC td { background-color: #d1d1ff; } div.dtcontainer tr.even.gradeC td.sorting_1 { background-color: #d5d5ff; } div.dtcontainer tr.even.gradeC td.sorting_2 { background-color: #e2e2ff; } div.dtcontainer tr.even.gradeC td { background-color: #e2e2ff; } div.dtcontainer tr.odd.gradeX td.sorting_1 { background-color: #ffc4c4; } div.dtcontainer tr.odd.gradeX td.sorting_2 { background-color: #ffd1d1; } div.dtcontainer tr.odd.gradeX td { background-color: #ffd1d1; } div.dtcontainer tr.even.gradeX td.sorting_1 { background-color: #ffd5d5; } div.dtcontainer tr.even.gradeX td.sorting_2 { background-color: #ffe2e2; } div.dtcontainer tr.even.gradeX td { background-color: #ffe2e2; } div.dtcontainer tr.odd.gradeU td.sorting_1 { background-color: #c4c4c4; } div.dtcontainer tr.odd.gradeU td.sorting_2 { background-color: #d1d1d1; } div.dtcontainer tr.odd.gradeU td { background-color: #d1d1d1; } div.dtcontainer tr.even.gradeU td.sorting_1 { background-color: #d5d5d5; } div.dtcontainer tr.even.gradeU td.sorting_2 { background-color: #e2e2e2; } div.dtcontainer tr.even.gradeU td { background-color: #e2e2e2; } /* * Row highlighting example */ div.dtcontainer .ex_highlight #example tbody tr.even:hover, div.dtcontainer #example tbody tr.even td.highlighted { background-color: #ECFFB3; } div.dtcontainer .ex_highlight #example tbody tr.odd:hover, div.dtcontainer #example tbody tr.odd td.highlighted { background-color: #E6FF99; } div.dtcontainer .css_right { float: right; } div.datatablesheader { overflow: hidden; width: 100%; } div.datatablescroller { width: 640px; height: 445px; /*clear: both;*/ overflow-y: auto; overflow-x: hidden; background: #f2f2f2; border: 1px solid #CCCCCC; } div.datatablescroller > table { background: white; } div.bagvisibilitydiv { display: none; } table.dttable { clear: both; display: none; } /*table#statistics_editorparts_BagTransformer_table_bitstreamtable,*/ /*table#statistics_editorparts_BagTransformer_table_itemtable,*/ /*.dataTables_wrapper {*/ /*display: none;*/ /*}*/ table.bitstreamtable { width: 100%; background-color: white; } div.tableslider { width: 100%; display: none; } span.itemspan { line-height: 22px; } .dtcontainer.ui-dialog-content { font-size: 11.2px; } table.dttable th { padding: inherit; }