planetlab/css/plc_tables.css

   1 /* $Id$ */
   2 table.plc_table {
   3     width: auto;
   4     padding: 0;
   5     margin: 0 auto 1.5em auto;
   6     border-collapse:collapse;
   7 }
   8 table.plc_table thead tr, table.plc_table tbody tr {
   9     border-left: 1px solid #C1DAD7;
  10 }
  11 /* remove border for search/pagesize area */
  12 table.plc_table thead tr.pagesize_area, table.plc_table thead tr.search_area {
  13     border-left: 0px;
  14 }
  15
  16 th.plc_table {
  17     font: bold 10px/22px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  18     color: #4f6b72;
  19     border-right: 1px solid #C1DAD7;
  20     border-bottom: 1px solid #C1DAD7;
  21     border-top: 1px solid #C1DAD7;
  22     letter-spacing: 1px;
  23     text-transform: uppercase;
  24     text-align: left;
  25     padding: 8px 12px 4px 12px;
  26     background: #CAE8EA url(/planetlab/icons/tablesort_header.jpg) no-repeat;
  27     vertical-align:middle;
  28 }
  29 table.plc_table>tbody>tr>td {
  30     font: normal 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  31     border-right: 1px solid #C1DAD7;
  32     border-bottom: 1px solid #C1DAD7;
  33     padding: 6px 12px 6px 12px;
  34     color: #4f6b72;
  35 }
  36 th.sortable,
  37 th.sortable-text,
  38 th.sortable-date,
  39 th.sortable-keep,
  40 th.sortable-date-dmy,
  41 th.sortable-numeric,
  42 th.sortable-currency,
  43 th.sortable-sortByTwelveHourTimestamp,
  44 th.sortable-sortIPAddress,
  45 th.sortable-sortEnglishLonghandDateFormat,
  46 th.sortable-sortScientificNotation,
  47 th.sortable-sortImage,
  48 th.sortable-sortFileSize,
  49 th.sortable-sortAlphaNumeric,
  50 th.sortable-sortEnglishDateTime {
  51     cursor:pointer;
  52     background: #CAE8EA url(/planetlab/icons/tablesort_header_sortable.jpg) no-repeat;
  53     padding: 8px 12px 4px 16px;
  54 }
  55 th.forwardSort {
  56     background:#CAE8EA url(/planetlab/icons/tablesort_header_down.jpg) no-repeat 0 0;
  57 }
  58 th.reverseSort {
  59     background:#CAE8EA url(/planetlab/icons/tablesort_header_up.jpg) no-repeat 0 0;
  60 }
  61 table thead th.forwardSort a,
  62 table thead th.reverseSort a {
  63     color:#000;
  64     text-decoration:none;
  65 }
  66 /* rows with odd index */
  67 tr.alt {
  68     background: #F5FAFA;
  69     color: #797268;
  70 }
  71
  72 /* sort columns */
  73 /* Poor old Internet Explorer 6 has a bug that means we can't use background images for the table rows
  74    as it trys to download the image each and every time that it is used (which means a 1000 row table
  75    will produce 1000 http requests for the image in question) */
  76 tr[class="alt"]>td {
  77     background: #F5FAFA url(/planetlab/icons/tablesort_td_alt.jpg) no-repeat;
  78 }
  79 table.plc_table>tbody>tr>td [class~="alt"] {
  80     background: #edf3f3 url(/planetlab/icons/tablesort_col_alt.jpg) no-repeat !important;
  81 }
  82 /* Poor old Internet Explorer won't see the next two rules either as it doesn't get :first-child */
  83 table.plc_table>tbody>tr.alt>td:first-child {
  84     background: #F5FAFA url(/planetlab/icons/tablesort_bullet2.gif) no-repeat;
  85     font-weight:bold;
  86 }
  87 table.plc_table>tbody>tr>td:first-child {
  88     background: #fff url(/planetlab/icons/tablesort_bullet1.gif) no-repeat;
  89     font-weight:bold;
  90 }
  91
  92 /* table decorations */
  93 td.search_area {
  94     text-align:right;
  95     padding-right: 30px;
  96 }
  97 td.pagesize_area {
  98     text-align:right;
  99     padding-right: 30px;
 100 }
 101 .pagesize_label, .pagesize_input {
 102     font-style: oblique;
 103     font-size: .5em;
 104 }
 105 .table_search_label{
 106     font-weight:bold;
 107 }
 108 .table_reset {
 109     border:1px;
 110 }
 111
 112 /* Pagination list styles */
 113 ul.fdtablePaginater {
 114     display:table;
 115     list-style:none;
 116     padding:0;
 117     margin:0 auto;
 118     text-align:center;
 119     height:1.5em;
 120     width:auto;
 121     margin-bottom:1em;
 122 }
 123 ul.fdtablePaginater li {
 124     display:table-cell;
 125     padding-right:4px;
 126     color:#666;
 127     list-style:none;
 128
 129     -moz-user-select:none;
 130     -khtml-user-select:none;
 131 }
 132 ul.fdtablePaginater li a.currentPage {
 133     border-color:#a84444 !important;
 134     color:#000;
 135 }
 136 ul.fdtablePaginater li a:active {
 137     border-color:#222 !important;
 138     color:#222;
 139 }
 140 ul.fdtablePaginater li a,
 141 ul.fdtablePaginater li div {
 142     display:block;
 143     width:2em;
 144     font-size:1em;
 145     color:#666;
 146     padding:0;
 147     margin:0;
 148     text-decoration:none;
 149     outline:none;
 150     border:1px solid #ccc;
 151     font-family:georgia, serif;
 152 }
 153 ul.fdtablePaginater li div {
 154     cursor:normal;
 155     opacity:.5;
 156     filter:alpha(opacity=50);
 157 }
 158 ul.fdtablePaginater li a span,
 159 ul.fdtablePaginater li div span {
 160     display:block;
 161     line-height:2em;
 162     border:1px solid #fff;
 163     background:#fff url(/planetlab/icons/tablesort_gradient.gif) repeat-x 0 -20px;
 164 }
 165 ul.fdtablePaginater li a {
 166     cursor:pointer;
 167 }
 168 ul.fdtablePaginater li a:focus {
 169     color:#333;
 170     text-decoration:none;
 171     border-color:#aaa;
 172 }
 173 .fdtablePaginaterWrap {
 174     text-align:center;
 175     clear:both;
 176     text-decoration:none;
 177 }
 178 ul.fdtablePaginater li .next-page span,
 179 ul.fdtablePaginater li .previous-page span,
 180 ul.fdtablePaginater li .first-page span,
 181 ul.fdtablePaginater li .last-page span {
 182     font-weight:bold !important;
 183 }
 184 /* Keep the table columns an equal size during pagination */
 185 td.sized1 {
 186     width:16em;
 187     text-align:left;
 188 }
 189 td.sized2 {
 190     width:10em;
 191     text-align:left;
 192 }
 193 td.sized3 {
 194     width:7em;
 195     text-align:left;
 196 }
 197 /*
 198    tfoot td
 199         {
 200         text-align:right;
 201         font-weight:bold;
 202         text-transform:uppercase;
 203         letter-spacing:1px;
 204         }
 205    */
 206 #visibleTotal {
 207     text-align:center;
 208     letter-spacing:auto;
 209 }
 210 * html ul.fdtablePaginater li div span,
 211 * html ul.fdtablePaginater li div span {
 212     background:#eee;
 213 }
 214 tr.invisibleRow {
 215     display:none;
 216     visibility:hidden;
 217 }
 218 p.paginationText {
 219     font-style:oblique;
 220 }
 221 p.plc_filter_note {
 222     font-style:oblique;
 223     font-size:0.6em;
 224     font-family: georgia;
 225     text-align: center
 226 }
 227
 228 <!--[if IE]>
 229 <style type="text/css">
 230 ul.fdtablePaginater {display:inline-block;}
 231 mul.fdtablePaginater {display:inline;}
 232 ul.fdtablePaginater li {float:left;}
 233 ul.fdtablePaginater {text-align:center;}
 234 table { border-bottom:1px solid #C1DAD7; }
 235 </style>
 236 <![endif]-->