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

Last change on this file since 286 was 286, checked in by gav, 14 years ago

Add CustomTagLib with checkBoxList.

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