diff --git a/CRM/Core/Resources.php b/CRM/Core/Resources.php index 30fa19177ef5d35aabc26d2b46bb6f851b79ffa5..a871e774e4c18c8cd7b8297399be18c7b82557a9 100644 --- a/CRM/Core/Resources.php +++ b/CRM/Core/Resources.php @@ -555,7 +555,6 @@ class CRM_Core_Resources { "packages/jquery/plugins/jquery.timeentry$min.js", - "packages/jquery/plugins/DataTables/media/css/demo_table_jui.css", "packages/jquery/plugins/DataTables/media/js/jquery.dataTables$min.js", "packages/jquery/plugins/jquery.FormNavigate$min.js", diff --git a/css/civicrm.css b/css/civicrm.css index 9cb8be9b7b2d27d7e0fd317a292cef7283e2a71a..7aebf88cd17448ad57d2867d551e14635644d049 100644 --- a/css/civicrm.css +++ b/css/civicrm.css @@ -2990,23 +2990,473 @@ div#crm-container form { padding-left: 16px; } -/* DataTables fixes */ -#crm-container .dataTables_length { +/** DATATABLES **/ +/* + * jQuery UI specific styling + */ + +.crm-container .paging_two_button .ui-button { + float: left; + cursor: pointer; + * cursor: hand; +} + +.crm-container .paging_full_numbers .ui-button { + padding: 2px 6px; + margin: 0; + cursor: pointer; + * cursor: hand; + color: white !important; +} + +.crm-container .dataTables_paginate .ui-button { + margin-right: -0.1em !important; +} + +.crm-container .paging_full_numbers { + width: 350px !important; +} + +.crm-container .dataTables_wrapper .ui-toolbar { + padding: 5px; +} + +.crm-container .dataTables_paginate { + width: auto; +} + +.crm-container .dataTables_info { + padding-top: 3px; +} + +.crm-container table.display thead th { + padding: 3px 0px 3px 10px; + cursor: pointer; + * cursor: hand; +} + +.crm-container div.dataTables_wrapper .ui-widget-header { + font-weight: normal; +} + + +/* + * Sort arrow icon positioning + */ +.crm-container table.display thead th div.DataTables_sort_wrapper { + position: relative; + padding-right: 20px; +} + +.crm-container table.display thead th div.DataTables_sort_wrapper span { + position: absolute; + top: 50%; + margin-top: -8px; + right: 0; +} + +/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * + * DataTables features + */ + +.crm-container .dataTables_wrapper { + position: relative; + clear: both; + zoom: 1; /* Feeling sorry for IE */ +} + +.crm-container .dataTables_processing { + position: absolute; + top: 50%; + left: 50%; + width: 250px; + height: 30px; + margin-left: -125px; + margin-top: -15px; + padding: 14px 0 2px 0; + border: 1px solid #ddd; + text-align: center; + color: #999; + font-size: 14px; + background-color: white; +} + +.crm-container .dataTables_length { + width: 40%; float: none; padding-bottom: 5px; } -#crm-container .crm-datatable-pager-top { + +.crm-container .dataTables_filter { + width: 50%; + float: right; + text-align: right; +} + +.crm-container .dataTables_info { + width: 60%; + float: left; +} + +.crm-container .dataTables_paginate { + float: right; + text-align: right; +} + + +/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * + * DataTables display + */ +.crm-container table.display { + margin: 0 auto; + clear: both; + width: 100%; +} + +.crm-container table.display thead th { + padding: 3px 18px 3px 10px; + border-bottom: 1px solid black; + font-weight: bold; + cursor: pointer; + * cursor: hand; +} + +.crm-container table.display tfoot th { + padding: 3px 18px 3px 10px; + border-top: 1px solid black; + font-weight: bold; +} + +.crm-container table.display tr.heading2 td { + border-bottom: 1px solid #aaa; +} + +.crm-container table.display td { + padding: 3px 10px; +} + +.crm-container table.display td.center { + text-align: center; +} + +/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * + * DataTables row classes + */ +.crm-container table.display tr.odd.gradeA { + background-color: #ddffdd; +} + +.crm-container table.display tr.even.gradeA { + background-color: #eeffee; +} + +.crm-container table.display tr.odd.gradeC { + background-color: #ddddff; +} + +.crm-container table.display tr.even.gradeC { + background-color: #eeeeff; +} + +.crm-container table.display tr.odd.gradeX { + background-color: #ffdddd; +} + +.crm-container table.display tr.even.gradeX { + background-color: #ffeeee; +} + +.crm-container table.display tr.odd.gradeU { + background-color: #ddd; +} + +.crm-container table.display tr.even.gradeU { + background-color: #eee; +} + + +.crm-container tr.odd { + background-color: #E2E4FF; +} + +.crm-container tr.even { + background-color: white; +} + +/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * + * Misc + */ +.crm-container .dataTables_scroll { + clear: both; +} + +.crm-container .dataTables_scrollBody { + *margin-top: -1px; + -webkit-overflow-scrolling: touch; +} + +.crm-container .top, .bottom { + padding: 15px; + background-color: #F5F5F5; + border: 1px solid #CCCCCC; +} + +.crm-container .top .dataTables_info { + float: none; +} + +.crm-container .dataTables_empty { + text-align: center; +} + +.crm-container tfoot input { + margin: 0.5em 0; + width: 100%; + color: #444; +} + +.crm-container tfoot input.search_init { + color: #999; +} + +.crm-container td.group { + background-color: #d1cfd0; + border-bottom: 2px solid #A19B9E; + border-top: 2px solid #A19B9E; +} + +.crm-container td.details { + background-color: #d1cfd0; + border: 2px solid #A19B9E; +} + + +.crm-container .example_alt_pagination div.dataTables_info { + width: 40%; +} + +.crm-container .paging_full_numbers { + width: 400px; + height: 22px; + line-height: 22px; +} + +.crm-container .paging_full_numbers a:active { + outline: none +} + +.crm-container .paging_full_numbers a:hover { + text-decoration: none; +} + +.crm-container .paging_full_numbers a.paginate_button, +.crm-container .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; +} + +.crm-container .paging_full_numbers a.paginate_button { + background-color: #ddd; +} + +.crm-container .paging_full_numbers a.paginate_button:hover { + background-color: #ccc; + text-decoration: none !important; +} + +.crm-container .paging_full_numbers a.paginate_active { + background-color: #99B3FF; +} + +.crm-container table.display tr.even.row_selected td { + background-color: #B0BED9; +} + +.crm-container table.display tr.odd.row_selected td { + background-color: #9FAFD1; +} + +/* + * Sorting classes for columns + */ +/* For the standard odd/even */ +.crm-container tr.odd td.sorting_1 { + background-color: #D3D6FF; +} + +.crm-container tr.odd td.sorting_2 { + background-color: #DADCFF; +} + +.crm-container tr.odd td.sorting_3 { + background-color: #E0E2FF; +} + +.crm-container tr.even td.sorting_1 { + background-color: #EAEBFF; +} + +.crm-container tr.even td.sorting_2 { + background-color: #F2F3FF; +} + +.crm-container 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 + */ +.crm-container tr.odd.gradeA td.sorting_1 { + background-color: #c4ffc4; +} + +.crm-container tr.odd.gradeA td.sorting_2 { + background-color: #d1ffd1; +} + +.crm-container tr.odd.gradeA td.sorting_3 { + background-color: #d1ffd1; +} + +.crm-container tr.even.gradeA td.sorting_1 { + background-color: #d5ffd5; +} + +.crm-container tr.even.gradeA td.sorting_2 { + background-color: #e2ffe2; +} + +.crm-container tr.even.gradeA td.sorting_3 { + background-color: #e2ffe2; +} + +.crm-container tr.odd.gradeC td.sorting_1 { + background-color: #c4c4ff; +} + +.crm-container tr.odd.gradeC td.sorting_2 { + background-color: #d1d1ff; +} + +.crm-container tr.odd.gradeC td.sorting_3 { + background-color: #d1d1ff; +} + +.crm-container tr.even.gradeC td.sorting_1 { + background-color: #d5d5ff; +} + +.crm-container tr.even.gradeC td.sorting_2 { + background-color: #e2e2ff; +} + +.crm-container tr.even.gradeC td.sorting_3 { + background-color: #e2e2ff; +} + +.crm-container tr.odd.gradeX td.sorting_1 { + background-color: #ffc4c4; +} + +.crm-container tr.odd.gradeX td.sorting_2 { + background-color: #ffd1d1; +} + +.crm-container tr.odd.gradeX td.sorting_3 { + background-color: #ffd1d1; +} + +.crm-container tr.even.gradeX td.sorting_1 { + background-color: #ffd5d5; +} + +.crm-container tr.even.gradeX td.sorting_2 { + background-color: #ffe2e2; +} + +.crm-container tr.even.gradeX td.sorting_3 { + background-color: #ffe2e2; +} + +.crm-container tr.odd.gradeU td.sorting_1 { + background-color: #c4c4c4; +} + +.crm-container tr.odd.gradeU td.sorting_2 { + background-color: #d1d1d1; +} + +.crm-container tr.odd.gradeU td.sorting_3 { + background-color: #d1d1d1; +} + +.crm-container tr.even.gradeU td.sorting_1 { + background-color: #d5d5d5; +} + +.crm-container tr.even.gradeU td.sorting_2 { + background-color: #e2e2e2; +} + +.crm-container tr.even.gradeU td.sorting_3 { + background-color: #e2e2e2; +} + +/* + * KeyTable + */ +.crm-container table.KeyTable td { + border: 3px solid transparent; +} + +.crm-container table.KeyTable td.focus { + border: 3px solid #3366FF; +} + +.crm-container table.display tr.gradeA { + background-color: #eeffee; +} + +.crm-container table.display tr.gradeC { + background-color: #ddddff; +} + +.crm-container table.display tr.gradeX { + background-color: #ffdddd; +} + +.crm-container table.display tr.gradeU { + background-color: #ddd; +} + +/* DataTables fixes */ +.crm-container .crm-datatable-pager-top { padding-top: 5px; padding-bottom: 25px; } -#crm-container .crm-datatable-pager-bottom { +.crm-container .crm-datatable-pager-bottom { padding-top: 10px; padding-bottom: 25px; } -#crm-container .crm-datatable-pager-top .dataTables_length { +.crm-container .crm-datatable-pager-top .dataTables_length { float: left; } -#crm-container .css_right { +.crm-container .css_right { float: right; }