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

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

Move asset tree/overview to an overlay pane.

File size: 11.9 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: #006dba;
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.appControl a {
112    color: #666;
113}
114
115.logoutButton {
116    float: right;
117    padding: 0.3em 0px 0.3em 0;
118    font-size: 14px;
119    margin: 0 50px 0 0;
120    /*border: 1px solid #ccc;*/
121}
122
123.logoutButton:hover {
124    color: red;
125    padding: 0.5em 0px 0.1em 0;
126}
127
128/* ORIGINAL NAVIGATION MENU */
129
130.nav {
131    text-align: center;
132    background: url("../images/linkPanel_long.png") top no-repeat;
133    padding: 10px 0px 0px 0px;
134    width: 980px;
135    height: 40px;
136}
137
138.menuButton {
139    font-size: 14px;
140    padding: 0 5px;
141}
142.menuButton a {
143    color: #333;
144    padding: 14px 25px;
145}
146.menuButton a.home {
147    /*background: url(../images/skin/house.png) center left no-repeat;*/
148    color: #333;
149    /*padding: 25px;*/
150}
151.menuButton a.list {
152    /*background: url(../images/skin/database_table.png) center left no-repeat;*/
153    color: #333;
154    /*padding-left: 25px;*/
155}
156.menuButton a.create {
157    /*background: url(../images/skin/database_add.png) center left no-repeat;*/
158    color: #333;
159    /*padding-left: 25px;*/
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;
169    padding: 5px 5px 5px 0px
170}
171
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
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;
189    padding: 0;
190}
191div.errors li {
192        background: url(../images/skin/exclamation.png) 8px 0% no-repeat;
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}
203td.errors textarea {
204    border: 1px solid red;
205}
206
207input.time {
208    width:40px;
209}
210input.time.errors {
211    border: 1px solid red;
212}
213input.medium {
214    width:60px;
215}
216input.medium.errors {
217    border: 1px solid red;
218}
219input.description {
220    width:450px;
221}
222
223/* TABLES */
224
225table {
226    border: 1px solid #ccc;
227    width: 100%
228}
229tr {
230    border: 0;
231}
232td, th {
233    font: 14px verdana, arial, helvetica, sans-serif;
234    line-height: 17px;
235    padding: 5px 6px;
236    text-align: left;
237    vertical-align: top;
238}
239th {
240    background: #fff url(../images/skin/shadow.jpg);
241    color: #555;
242    font-size: 14px;
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;
250    font-size: 14px;
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
272.clickableOdd {
273    background: #f7f7f7;
274    cursor: pointer;
275}
276.clickableEven {
277    background: #fff;
278    cursor: pointer;
279}
280
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;
298    font-size: 14px;
299    overflow: hidden;
300    padding: 10px 3px;
301}
302.paginateButtons a {
303    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
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
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
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 */
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}
357
358.buttons {
359    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
360    border: 1px solid #ccc;
361    color: #666;
362    font-size: 14px;
363    margin-top: -1px;
364    margin-bottom: 5px;
365    overflow: hidden;
366    padding: 3px;
367}
368.buttons input {
369    background: #fff;
370    border: 0;
371    color: #333;
372    cursor: pointer;
373    font-size: 14px;
374    font-weight: bold;
375    margin-left: 3px;
376    overflow: visible;
377    padding: 0px 6px;
378}
379.buttons input.delete {
380    background: transparent url(../images/skin/database_delete.png) 5px 50% no-repeat;
381    padding-left: 28px;
382}
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}
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}
419.buttons input.add {
420    background: transparent url(../images/skin/database_add.png) 5px 50% no-repeat;
421    padding-left: 28px;
422}
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}
439
440#bottom {
441  background: url("../images/bottomBg.png") no-repeat scroll center;
442  width: 1020px;
443  height: 100px;
444}
445
446/* Overlay Pane and filterPane plugin*/
447div.overlayPane {
448    position: absolute;
449    width:70%;
450    left: 50%;
451    margin-left: -36%;
452    top: 50%;
453    margin-top: -26%;
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
468 /* Navigation Plugin Override */
469.navigation {
470    padding: 0px 0px 0px 50px;
471    list-style-type: none;
472    clear: both;
473    font-size: 14px;
474    /*overflow: hidden;*/ /* Clearing floats */
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 {
493    color: #666;
494    /* background-color: #aaa; */
495    padding: 0.3em 0.75em 0;
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; */
505    padding: 0.5em 0.75em;
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;
524    padding: 0.3em 0.75em;
525    /*background-color: #555;*/
526}
527
528/* Sub navigation */
529.subnavigation {
530    /*padding: 0px 0px 0px 165px;*/
531    padding: 0px 0px 0px 105px;
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}
571
572/* Tree */
573
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
586div.tree_button {
587    text-align: left;
588    padding-top: 4px;
589}
590div.tree {
591}
592div.tree li a{
593}
594div.tree ul {
595    list-style-type: none;
596    padding-left: 15px;
597}
598div.tree li {
599    background: url(../images/skin/ln.gif) 0px 0px no-repeat;
600    padding-left: 10px;
601    margin: 2px;
602}
603
604/* CheckBoxList Tag Lib */
605
606.CheckBoxList {
607    height: 300px;
608    overflow: auto;
609    overflow-x: hidden;
610    width: 400px;
611    border: 1px solid #ccc;
612    list-style-type: none;
613    margin: 0;
614    padding: 0px;
615}
616.CheckBoxList li {
617    padding: 5px;
618}
Note: See TracBrowser for help on using the repository browser.