diff --git a/data/css/data_table.css b/data/css/data_table.css index b230bea8..1ee83731 100644 --- a/data/css/data_table.css +++ b/data/css/data_table.css @@ -1,36 +1,9 @@ -/* - * File: data_table.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. - */ - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables features - */ - .dataTables_wrapper { + border-radius: 10px; + width: 90%; + margin: 0 auto 0 auto; + padding: 20px; + background-color: white; position: relative; min-height: 302px; clear: both; @@ -42,7 +15,7 @@ position: absolute; top: 50%; left: 50%; - width: 250px; + width: 20px; height: 30px; margin-left: -125px; margin-top: -15px; @@ -63,11 +36,14 @@ width: 50%; float: right; text-align: right; + margin-bottom: 25px; } .dataTables_info { - width: 60%; + width: 40%; float: left; + background-color: white; + font-weight: bold; } .dataTables_paginate { @@ -75,6 +51,7 @@ * width: 50px; float: right; text-align: right; + background-color: white; } /* Pagination nested */ @@ -107,9 +84,8 @@ * DataTables display */ table.display { - margin: 0 auto; + margin: 20px auto; clear: both; - width: 100%; /* Note Firefox 3.5 and before have a bug with border-collapse * ( https://bugzilla.mozilla.org/show%5Fbug.cgi?id=155955 ) @@ -127,8 +103,9 @@ table.display { table.display thead th { padding: 3px 18px 3px 10px; - border-bottom: 1px solid black; + background-color: white; font-weight: bold; + font-size: 16px; cursor: pointer; * cursor: hand; } @@ -145,6 +122,7 @@ table.display tr.heading2 td { table.display td { padding: 3px 10px; + font-size: 16px; } table.display td.center { @@ -218,11 +196,11 @@ table.display tr.even.gradeU { tr.odd { - background-color: #E2E4FF; + background-color: white; } tr.even { - background-color: white; + background-color: #F5F5F5; } @@ -255,7 +233,11 @@ tr.even { } .dataTables_empty { + font-size: 24px; text-align: center; + vertical-align: middle; + height: 200px; + width: 90%; } tfoot input { @@ -279,11 +261,6 @@ td.details { border: 2px solid #A19B9E; } - -.example_alt_pagination div.dataTables_info { - width: 40%; -} - .paging_full_numbers { width: 400px; height: 22px; @@ -321,214 +298,6 @@ 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; -} - -.ex_highlight_row #example tr.even:hover { - background-color: #ECFFB3; -} - -.ex_highlight_row #example tr.even:hover td.sorting_1 { - background-color: #DDFF75; -} - -.ex_highlight_row #example tr.even:hover td.sorting_2 { - background-color: #E7FF9E; -} - -.ex_highlight_row #example tr.even:hover td.sorting_3 { - background-color: #E2FF89; -} - -.ex_highlight_row #example tr.odd:hover { - background-color: #E6FF99; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_1 { - background-color: #D6FF5C; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_2 { - background-color: #E0FF84; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_3 { - background-color: #DBFF70; -} - - -/* - * KeyTable - */ -table.KeyTable td { - border: 3px solid transparent; -} - -table.KeyTable td.focus { - border: 3px solid #3366FF; -} - -table.display tr.gradeA { - background-color: #eeffee; -} - -table.display tr.gradeC { - background-color: #ddddff; -} - -table.display tr.gradeX { - background-color: #ffdddd; -} - -table.display tr.gradeU { - background-color: #ddd; -} - div.box { height: 100px; padding: 10px; diff --git a/data/css/style.css b/data/css/style.css index 7afda82b..e0a951d5 100755 --- a/data/css/style.css +++ b/data/css/style.css @@ -87,20 +87,12 @@ a:hover { color: #036; } */ body { background-color: #EBF4FB } -div#logo { float: left; margin-left: 10px; } - -ul#nav { font-family: Arial, Verdana; font-size: 14px; padding: 0; list-style: none; float: left; } -ul#nav li { display: inline; margin-top: 25px; } -ul#nav li a { text-decoration: none; border-top: 1px solid #ffffff; padding: 5px 15px 5px 15px; margin-left: 1px; white-space: nowrap; } -ul#nav li a:hover { background: #22eeff } - -table#artist_table { margin-left: auto; margin-right: auto; } - -footer { margin-top: 40px; text-align: center; padding: 20px; } - - - +header { height: 68px; padding: 0 10px 0 10px; background-color: #F5F5F5; margin-bottom: 20px; } +table#artist_table th#name { width: 30%; } +table#artist_table th#status { width: 10%; } +table#artist_table th#latestalbum { width: 35%; } +table#artist_table th#have { width: 20%; } diff --git a/data/interfaces/default/base.html b/data/interfaces/default/base.html old mode 100644 new mode 100755 index a82ee1f6..7fa334d5 --- a/data/interfaces/default/base.html +++ b/data/interfaces/default/base.html @@ -21,47 +21,28 @@ ${next.headerIncludes()} - +
${next.javascriptIncludes()} + diff --git a/data/interfaces/default/index.html b/data/interfaces/default/index.html index e09afd23..38c8ef3f 100644 --- a/data/interfaces/default/index.html +++ b/data/interfaces/default/index.html @@ -4,10 +4,10 @@| Artist Name | -Status | -Latest Album | -Have | +Artist Name | +Status | +Latest Album | +Have |
|---|