source: trunk/web-app/css/main.css @ 208

Last change on this file since 208 was 192, checked in by gav, 15 years ago

Facelift with new logo.

File size: 10.3 KB
RevLine 
[55]1html * {
2    margin: 0;
3    /*padding: 0; SELECT NOT DISPLAYED CORRECTLY IN FIREFOX */
[59]4
[55]5}
6
7/* GENERAL */
8
9.spinner {
10    padding: 5px;
11    position: absolute;
12    right: 0;
13}
14
15body {
[59]16    text-align: center; 
17    width: 980px
[55]18    background: #fff;
[106]19    color: #222;
[98]20    font: 14px verdana, arial, helvetica, sans-serif;
[59]21    background: transparent url("../images/brushed_metal.png") repeat fixed center;
[55]22}
23
[59]24#wrapper {
25  margin: 0 auto;
26  padding: 0;
27  width: 1024px;
28}
29
30#top {
31  background: url("../images/topBg.png") no-repeat scroll center;
32  width: 1020px;
[192]33  height: 31px;
[59]34}
35
36#content {
37  padding: 0px 20px 20px;
[192]38  background: url("../images/contentbg.png") repeat-y scroll center;
[59]39  width: 980px;
[141]40  /*border: 1px solid #ccc;*/
[59]41}
42
43#Header {
44  background: transparent url("../images/logo.png") no-repeat scroll center;
45  width: 980px;
[192]46  height: 136px;
[139]47  /*border: 1px solid;*/
[59]48}
[80]49#HeaderLink{
50  display: block;
[192]51  width: 958px;
52  height: 136px;
[80]53}
[59]54
[139]55/* Navigation plugin, top level. */
56#menu {
57    float: left;
[141]58    /*border: 1px solid #ccc;*/
[139]59}
60
[55]61a:link, a:visited, a:hover {
62    color: #666;
63    font-weight: bold;
64    text-decoration: none;
[59]65}
[55]66
[106]67img {
68    border: 0px;
69}
70
[55]71h1 {
72    color: #006dba;
73    font-weight: normal;
[98]74    font-size: 17px;
[59]75    margin: 0 0 .3em 0;
[55]76}
77
78ul {
[59]79    padding-left: 15px;
[55]80}
81
82input, select, textarea {
83    background-color: #fcfcfc;
84    border: 1px solid #ccc;
[98]85    font: 14px verdana, arial, helvetica, sans-serif;
[55]86    margin: 2px 0;
87    padding: 2px 4px;
88}
89select {
90   padding: 2px 2px 2px 0;
91}
92textarea {
[139]93    width: 450px;
94    height: 150px;
95    vertical-align: top;
[55]96}
97
98input:focus, select:focus, textarea:focus {
99    border: 1px solid #b2d1ff;
100}
101
102.body {
[110]103    padding: 20px 20px 20px 20px;
104    text-align: center;
[141]105    /*border: 1px solid #ccc;*/
[55]106}
107
[142]108/* Logout and Top Navigation Level */
[59]109
[142]110.appControl {
111    height: 2em;
112}
113
[141]114.logoutButton {
[139]115    float: right;
[142]116    padding: 0.3em 0px 0.3em 0;
[98]117    font-size: 14px;
[192]118    margin: 0 50px 0 0;
[142]119    /*border: 1px solid #ccc;*/
[59]120}
121
[141]122.logoutButton:hover {
[139]123    color: red;
[142]124    padding: 0.5em 0px 0.1em 0;
[139]125}
[55]126
[139]127/* ORIGINAL NAVIGATION MENU */
128
[55]129.nav {
[59]130    text-align: centre;
131    background: url("../images/linkPanel_long.png") top no-repeat;
[139]132    padding: 10px 0px 0px 0px;
[59]133    width: 980px;
134    height: 40px;
[55]135}
136
137.menuButton {
[98]138    font-size: 14px;
[55]139    padding: 0 5px;
140}
141.menuButton a {
142    color: #333;
[59]143    padding: 14px 25px;
[55]144}
145.menuButton a.home {
[59]146    /*background: url(../images/skin/house.png) center left no-repeat;*/
[55]147    color: #333;
[59]148    /*padding: 25px;*/
[55]149}
150.menuButton a.list {
[59]151    /*background: url(../images/skin/database_table.png) center left no-repeat;*/
[55]152    color: #333;
[59]153    /*padding-left: 25px;*/
[55]154}
155.menuButton a.create {
[59]156    /*background: url(../images/skin/database_add.png) center left no-repeat;*/
[55]157    color: #333;
[59]158    /*padding-left: 25px;*/
[55]159}
160
161/* MESSAGES AND ERRORS */
162
163.message {
164    background: #f3f8fc url(../images/skin/information.png) 8px 50% no-repeat;
165    border: 1px solid #b2d1ff;
166    color: #006dba;
167    margin: 10px 0 5px 0;
[59]168    padding: 5px 5px 5px 0px
[55]169}
170
171div.errors {
172    background: #fff3f3;
173    border: 1px solid red;
174    color: #cc0000;
175    margin: 10px 0 5px 0;
176    padding: 5px 0 5px 0;
177}
178div.errors ul {
179    list-style: none;
[59]180    padding: 0;
[55]181}
182div.errors li {
183        background: url(../images/skin/exclamation.png) 8px 0% no-repeat;
184    line-height: 16px;
185    padding-left: 30px;
186}
187
188td.errors select {
189    border: 1px solid red;
190}
191td.errors input {
192    border: 1px solid red;
193}
[98]194td.errors textarea {
195    border: 1px solid red;
196}
[55]197
[134]198input.time {
[98]199    width:40px;
200}
[134]201input.time.errors {
[98]202    border: 1px solid red;
203}
[134]204input.description {
205    width:450px;
206}
[98]207
[55]208/* TABLES */
209
210table {
211    border: 1px solid #ccc;
212    width: 100%
213}
214tr {
215    border: 0;
216}
[59]217td, th {
[98]218    font: 14px verdana, arial, helvetica, sans-serif;
219    line-height: 17px;
[55]220    padding: 5px 6px;
221    text-align: left;
222    vertical-align: top;
223}
224th {
225    background: #fff url(../images/skin/shadow.jpg);
[106]226    color: #555;
[98]227    font-size: 14px;
[55]228    font-weight: bold;
229    line-height: 17px;
230    padding: 2px 6px;
231}
232th a:link, th a:visited, th a:hover {
233    color: #333;
234    display: block;
[98]235    font-size: 14px;
[55]236    text-decoration: none;
237    width: 100%;
238}
239th.asc a, th.desc a {
240    background-position: right;
241    background-repeat: no-repeat;
242}
243th.asc a {
244    background-image: url(../images/skin/sorted_asc.gif);
245}
246th.desc a {
247    background-image: url(../images/skin/sorted_desc.gif);
248}
249
250.odd {
251    background: #f7f7f7;
252}
253.even {
254    background: #fff;
255}
256
[124]257.clickableOdd {
258    background: #f7f7f7;
259    cursor: pointer;
260}
261.clickableEven {
262    background: #fff;
263    cursor: pointer;
264}
265
[55]266/* LIST */
267
268.list table {
269    border-collapse: collapse;
270}
271.list th, .list td {
272    border-left: 1px solid #ddd;
273}
274.list th:hover, .list tr:hover {
275    background: #b2d1ff;
276}
277
278/* PAGINATION */
279
280.paginateButtons {
[155]281    /*background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;*/
282   /*border: 1px solid #ccc;*/
[55]283    border-top: 0;
284    color: #666;
[98]285    font-size: 14px;
[55]286    overflow: hidden;
287    padding: 10px 3px;
288}
289.paginateButtons a {
290    background: #fff;
291    border: 1px solid #ccc;
292    border-color: #ccc #aaa #aaa #ccc;
293    color: #666;
294    margin: 0 3px;
295    padding: 2px 6px;
296}
297.paginateButtons span {
298    padding: 2px 3px;
299}
300
301/* DIALOG */
302
303.dialog table {
304    padding: 5px 0;
305}
306
307.prop {
308    padding: 5px;
309}
310.prop .name {
311    text-align: left;
312    width: 15%;
313    white-space: nowrap;
314}
315.prop .value {
316    text-align: left;
317    width: 85%;
318}
319
320/* ACTION BUTTONS */
321
322.buttons {
323    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
324    border: 1px solid #ccc;
325    color: #666;
[98]326    font-size: 14px;
[84]327    margin-top: -1px;
328    margin-bottom: 5px;
[55]329    overflow: hidden;
330    padding: 0;
331}
332
333.buttons input {
334    background: #fff;
335    border: 0;
336    color: #333;
337    cursor: pointer;
[98]338    font-size: 14px;
[55]339    font-weight: bold;
340    margin-left: 3px;
341    overflow: visible;
342    padding: 2px 6px;
343}
344.buttons input.delete {
345    background: transparent url(../images/skin/database_delete.png) 5px 50% no-repeat;
346    padding-left: 28px;
347}
[181]348.buttons input.trash {
349    background: transparent url(../images/skin/bin_closed.png) 5px 50% no-repeat;
350    padding-left: 28px;
351}
352.buttons input.restore {
353    background: transparent url(../images/skin/bin_empty.png) 5px 50% no-repeat;
354    padding-left: 28px;
355}
356.buttons input.cancel {
357    background: transparent url(../images/skin/cross.png) 5px 50% no-repeat;
358    padding-left: 28px;
359}
360.buttons input.complete {
361    background: transparent url(../images/skin/tick.png) 5px 50% no-repeat;
362    padding-left: 28px;
363}
364.buttons input.reopen {
365    background: transparent url(../images/skin/door_open.png) 5px 50% no-repeat;
366    padding-left: 28px;
367}
368.buttons input.approve {
369    background: transparent url(../images/skin/database_gear.png) 5px 50% no-repeat;
370    padding-left: 28px;
371}
372.buttons input.renegeApproval {
373    background: transparent url(../images/skin/cog_delete.png) 5px 50% no-repeat;
374    padding-left: 28px;
375}
[55]376.buttons input.edit {
377    background: transparent url(../images/skin/database_edit.png) 5px 50% no-repeat;
378    padding-left: 28px;
379}
380.buttons input.save {
381    background: transparent url(../images/skin/database_save.png) 5px 50% no-repeat;
382    padding-left: 28px;
383}
[106]384.buttons input.add {
385    background: transparent url(../images/skin/database_add.png) 5px 50% no-repeat;
386    padding-left: 28px;
387}
[134]388.buttons input.search {
389    background: transparent url(../images/skin/database_search.png) 5px 50% no-repeat;
390    padding-left: 28px;
391}
392.buttons input.link {
393    background: transparent url(../images/skin/database_link.png) 5px 50% no-repeat;
394    padding-left: 28px;
395}
396.buttons input.go {
397    background: transparent url(../images/skin/database_go.png) 5px 50% no-repeat;
398    padding-left: 28px;
399}
400.buttons input.table {
401    background: transparent url(../images/skin/database_table.png) 5px 50% no-repeat;
402    padding-left: 28px;
403}
[59]404
405#bottom {
406  background: url("../images/bottomBg.png") no-repeat scroll center;
407  width: 1020px;
408  height: 100px;
[139]409}
410
[155]411/* Overlay Pane and filterPane plugin*/
412div.overlayPane {
413    position: absolute;
414    width:70%;
415    left: 50%;
[192]416    margin-left: -36%;
[155]417    top: 50%;
[192]418    margin-top: -26%;
[155]419    border: 2px solid #666666;
420    background-color: white;
421    padding: 5px;
422    z-index: 1;
423}
424
425.overlayTable {
426    width: 100%;
427}
428
429a.remove img {
430    border:none;
431}
432
[139]433 /* Navigation Plugin Override */
434.navigation {
[192]435    padding: 0px 0px 0px 50px;
[139]436    list-style-type: none;
437    clear: both;
438    font-size: 14px;
[141]439    /*overflow: hidden;*/ /* Clearing floats */
[139]440}
441
442.navigation li {
443    float: left;
444    /*border: 0px*/
445    /* border: 1px solid #888; */
446     /*border-left-color: #bbb;*/  /* Highlight border-color */
447}
448
449.navigation li.navigation_first {
450     /*border-left-color: #888; */
451}
452
453.navigation li.navigation_active {
454     /*border-left-color: #555;*/  /* Highlight border-color of active item */
455}
456
457.navigation li a {
458    /* color: #fff; */
459    /* background-color: #aaa; */
[141]460    padding: 0.3em 0.75em 0;
[139]461    display: block;
462    text-decoration: none;
463}
464
465.navigation li a:hover {
466    color: red;
467    /* background-color: #999; */
468/*     font-weight: normal; */
469/*     font-size: 14px; */
[142]470    padding: 0.5em 0.75em;
[139]471    /*cursor: default;*/
472}
473
474.navigation li.navigation_active a {
475    /* background-color: #555; */
476/*    color: #fff;*/
477    color: #006dba;
478    /*color: black;*/
479    font-weight: bold;
480    font-size: 17px;
481    margin: 0 0 0 0;
482    /*cursor: default;*/
483}
484
485.navigation li.navigation_active a:hover {
486    color: #006dba;
487    font-weight: bold;
488    font-size: 17px;
[142]489    padding: 0.3em 0.75em;
[139]490    /*background-color: #555;*/
491}
492
493/* Sub navigation */
494.subnavigation {
495    /*padding: 0px 0px 0px 165px;*/
[192]496    padding: 0px 0px 0px 105px;
[139]497    list-style-type: none;
498    clear: both;
499    overflow: hidden; /* Clearing floats */
500}
501.subnavigation li {
502    float: left;
503    /* background-color: #555; */
504    padding: 0em 0.75em;
505    border-width: 0px 0;
506}
507.subnavigation li a {
508    color: #006dba;
509    font-weight: bold;
510    font-size: 17px;
511    display: block;
512    /*padding: 0px 0;*/
513    /* border-color: #555; */
514    border-style: solid;
515    border-width: 0px 0;
516    text-decoration: none;
517    /*margin: 0 0 0 0;*/
518    /*cursor: default;*/
519}
520
521.subnavigation li a:visited {
522    color: #006dba;
523}
524
525.subnavigation li a:hover {
526    /*color: red;*/
527    /*border-color: black;*/ 
528    border-width: 1px 0;
529}
530.subnavigation li.subnavigation_active a {
531    /*color: #e0e0e0; */
532    /*cursor: default;*/
533    /*border-color: #e0e0e0;*/
534    border-width: 1px 0;
535}
Note: See TracBrowser for help on using the repository browser.