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

Last change on this file since 331 was 328, checked in by gav, 15 years ago

Format to 4 spaces, no tabs.

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