source: greenstone3/trunk/web/interfaces/oran/style/core.css@ 19855

Last change on this file since 19855 was 19855, checked in by oranfry, 15 years ago

styles for new interface

File size: 11.2 KB
Line 
1body {
2 font-family: sans-serif;
3 padding: 20px;
4 margin: 0;
5 color: #444;
6}
7
8#container {
9 position: relative;
10 margin: 0 auto 20px auto;
11 max-width: 1200px;
12 padding: 0;
13 line-height: 160%;
14 background: url('../images/layout/containerLeft.png') scroll repeat-y left top;
15}
16#container2 {
17 background: url('../images/layout/containerRight.png') scroll repeat-y right top;
18}
19#container3 {
20 background: url('../images/layout/containerTop.png') scroll repeat-x left top;
21}
22#container4 {
23 background: url('../images/layout/containerBottom.png') scroll repeat-x left bottom;
24 padding: 10px;
25}
26
27#banner {
28 background: transparent url('../images/gsdlhead.gif') scroll no-repeat left top;
29 padding: 10px 20px 30px 20px;
30 max-height: 110px;
31 position: relative;
32}
33
34#content {
35 border-left: 1px solid #cdc;
36 border-right: 1px solid #cdc;
37 padding: 1em;
38 min-height: 300px;
39 /* background-color: #ff0; */
40}
41
42#rightSidebar {
43 border: 1px solid #cdc;
44 padding: 10px;
45 width: 25%;
46 min-width: 180px;
47 float: right;
48 margin: 0 0 10px 20px;
49 /* background-color: #f0f; */
50}
51
52#quickSearch {
53}
54
55
56#collectionLinks {
57 position: relative;
58}
59
60#collectionLinks a {
61 display: block;
62 float: left;
63 width: 160px;
64 height: 120px;
65 border: 1px solid #888;
66 background-position: center center;
67 background-repeat: no-repeat;
68 margin: 0 20px 20px 0;
69}
70
71#footer {
72 position: relative;
73 display: block;
74 height: 30px;
75 background: transparent url('../images/gsdlhead.gif') scroll no-repeat left top;
76 margin: 0 auto;
77 text-align: center;
78 vertical-align: middle;
79 font-size: 70%;
80 color: #fff;
81}
82
83
84/* some text should not be rendered as it is just there for search engines */
85#collectionLinks a b {
86 display: none;
87}
88
89/* make sure h1s and h2s are readable on the green banner */
90#banner h1, #banner h2, #banner h1 a, #banner h2 a {
91 color: #fff;
92 text-decoration: none;
93}
94
95#banner h1 {
96 font-size: 16px;
97 margin: 0 0 10px 0;
98}
99#banner h2 {
100 margin: 0 0 10px 1em;
101}
102
103
104/* css to make the tabs work */
105#nav {
106 position: absolute;
107 width: auto;
108 bottom: 0;
109 right: 0;
110 list-style: none;
111 margin:0;
112 padding: 0 15px 0 0;
113 font-size: 14px;
114}
115
116#nav li {
117 float: right;
118 color: #fff;
119 background: transparent url('../images/tab-right.png') scroll no-repeat 100% -100px;
120 margin: 0 5px 0 0;
121 padding: 0 8px 0 0;
122}
123
124#nav a {
125 display: block;
126 float: left;
127
128 background: transparent url('../images/tab-left.png') no-repeat scroll 0 -100px;
129 margin:0;
130 padding: 5px 4px 3px 10px;
131 font-weight: normal;
132 color: #fff;
133 text-decoration: none;
134 line-height: 1;
135}
136
137#nav li:hover, #nav li.current { background-position: 100% 0; }
138#nav li:hover a, #nav li.current a { background-position: 0 0; cursor:default; }
139
140
141/* css to make the page links work (home, help, preference) */
142#bannerLinks {
143 width: auto;
144 position: absolute;
145 list-style: none;
146 margin:0;
147 top: 15px;
148 right: 0;
149 padding: 0 15px 0 0;
150}
151
152#bannerLinks li {
153 float: right;
154 margin: 0;
155 background: transparent url('../images/tab-right.gif') no-repeat scroll 100% -50px;
156 padding: 0 2px 0 0;
157}
158
159#bannerLinks a {
160 display: block;
161 float: left;
162 display: table-cell;
163 min-width: 1em;
164 margin:0;
165 padding: 5px 5px 3px 10px;
166 font-weight: normal;
167 text-align: center;
168 color: #fff;
169 text-decoration: none;
170 line-height: 1;
171}
172
173#bannerLinks li.current a {
174 cursor: default;
175}
176
177#bannerLinks li:hover, #bannerLinks li.current { background-position: 100% 0; }
178
179#bannerLinks li.current a { text-decoration: underline; background-position: 0 0;}
180#bannerLinks img.spacer { display: table-cell; }
181
182
183/* css to make the classifier list pretty */
184.navList {
185 margin: 0 0 10px 0;
186 padding: 0;
187 background-color: #0a0;
188}
189
190.navList ul {
191 margin: 0;
192 padding: 0;
193 list-style: none;
194}
195
196.navList li {
197 float: left;
198 margin: 0 0 0 20px;
199 cursor: pointer;
200 color: #fff;
201}
202.navList li a, .navList li span {
203 padding: 0 1em;
204 display: block;
205 text-decoration: none;
206 color: #fff;
207}
208
209.navList li.current {
210 background-color: #efea6e;
211 color: #444;
212 cursor: default;
213}
214
215.navList li.current a, .navList li.current span {
216 color: #444;
217 cursor: default;
218}
219
220/* style the classifier results */
221#classifierResults {
222 margin: 0;
223 padding: 0;
224 /* border: 1px solid #f00; */
225}
226
227#classifierResults ul {
228 margin: 0 0 0 20px;
229 padding: 0;
230}
231
232#classifierResults li {
233 list-style: none;
234 margin: 0 0 .2em 0;
235 /* border: 1px solid #00f; */
236}
237
238#classifierResults li a {
239 padding: 3px 3px 3px 28px;
240 background-repeat: no-repeat;
241 background-position: 0 .1em;
242}
243
244
245#classifierResults .document a { background-image: url('../images/book.png'); }
246#classifierResults .document a:visited { background-image: url('../images/book-visited.png'); color: #999; }
247
248#classifierResults .shelf>a { background-image: url('../images/bookshelf.png'); }
249
250/* corners of the banner */
251.corner {
252 position: absolute;
253 background-image: url('../images/layout/corners.png');
254 background-repeat: no-repeat;
255 width: 20px;
256 height: 20px;
257}
258
259#cornerTopLeft {
260 left: 0; top: 0;
261 background-position: 0 0;
262}
263#cornerTopRight {
264 right: 0; top: 0;
265 background-position: -20px 0;
266}
267#cornerBottomLeft {
268 left: 0; bottom: 0;
269 background-position: 0 -20px;
270}
271#cornerBottomRight {
272 right: 0; bottom: 0;
273 background-position: -20px -20px;
274}
275
276.clear {
277 clear: both;
278}
279
280
281a:link, a:hover, a:active, a:visited { color: #050; }
282
283/*
284
285ul li>select, ul li>input {
286 padding: 0;
287 margin-left:5px;
288}
289
290
291
292div#banner ul, ul#resultlist, ul#tocnodes, ul#docbuttons, ul.tocnode, ul#bannerlist, ul#navbarlist, ul#collectionlist, ul#servicelist, ul#classifierlist, ul#classifiernodelist, ul#queryitemlist{
293 list-style-type:none;
294 margin:0;
295 padding:0;
296}
297
298div#banner ul li, ul#bannerlist li, ul#navbarlist li {
299 display: inline;
300 margin:0;
301 padding:0;
302}
303
304
305
306div#banner p {
307 margin:0;
308 padding: 0;
309 float:left;
310 font-size: 16px;
311 text-align: left;
312 overflow:hidden
313}
314
315div#banner p a {
316 background-image: url('../images/banner_bg.png');
317 background-repeat: repeat-y;
318}
319
320
321div#banner ul{
322 margin:0;
323 padding:0;
324 float:right;
325 font-size: 12px;
326}
327
328div#banner a{
329 text-decoration: none;
330 color:#000000;
331}
332
333
334
335ul#bannerlist li a {
336 padding: 0 10px 0 10px;
337 text-decoration: none;
338}
339
340ul#bannerlist li a:link, ul#bannerlist li a:visited
341{
342 background-color: #DEE79C;
343 background-image: url('../images/bg_off.png');
344 text-decoration: none
345}
346
347ul#bannerlist li a:hover{
348 background-color: #FFFF66;
349 background-image: url('../images/bg_on.png') ;
350 text-decoration: none
351}
352
353
354div#navbar{
355 clear:both;
356}
357
358ul#navbarlist{
359 margin:0;
360 padding:0;
361 list-style-type: none;
362 text-align:center;
363 width: 100%;
364 font-size: 80%;
365 background-image: url('../images/bg_green.png');
366 background-color: #99CC99
367 }
368
369ul#navbarlist li a {
370 padding: 0 20px 0 20px;
371 margin: 0;
372 color: #000000;
373 text-decoration: none;
374}
375
376ul#navbarlist li a:link, ul#navbarlist li a:visited{
377 background-image: url('../images/bg_off.png') ;
378 }
379
380ul#navbarlist li a:hover{
381 background-image: url('../images/bg_on.png') ;
382}
383
384
385ul#collectionlist li, ul#servicelist li{
386 display:block;
387 padding:0;
388 margin: .2em 0 0 0;
389 overflow:hidden;
390}
391
392
393ul#collectionlist img{
394 margin:0;
395 padding:0;
396 width: 150px;
397 height: 45px;
398 border: 1px solid black;
399 background-image: url('../images/collectimg_bg.png');
400 background-repeat: repeat-y;
401 overflow:hidden
402}
403
404ul#collectionlist li a.noimage{
405 display: block;
406 margin:0;
407 width: 145px;
408 height: 40px;
409 border: 1px solid black;
410 background-image: url('../images/collectimg_bg.png');
411 background-repeat: repeat-y;
412 overflow:hidden; padding-left:5px; padding-right:0; padding-top:5px; padding-bottom:0
413
414}
415
416ul#collectionlist li a{
417 font-size: 16px;
418 color: #000000;
419 text-decoration: none;
420 font-weight: bold;
421}
422
423ul#servicelist li a{
424 margin:0 .5em 0 0;
425}
426
427ul#queryitemlist li{
428 display:block;
429 margin: .2em 0 .2em 0;
430}
431
432ul#classifierlist li{
433 list-style: none;
434 margin: 0 0 5px 0;
435 padding: 0;
436 display: block;
437 color:#000;
438}
439
440ul#classifierlist li#activeclassifier{
441 font-weight:bold;
442 padding: 0 0 0 5px;
443 margin:0 0 5px 0;
444}
445
446 ul#classifierlist li a:link, ul#classifierlist li a:visited
447{
448 display:block;
449 margin:0;
450 background-image: url('../images/bg_off.png');
451 text-decoration: none;
452 color:#000;
453 width:100%; padding-left:5px; padding-right:0; padding-top:2px; padding-bottom:2px
454 }
455
456ul#classifierlist li a:hover, ul#classifierlist li a:active
457{
458 display:block;
459 margin:0;
460 background-image: url('../images/bg_on.png');
461 text-decoration: none; padding-left:5px; padding-right:0; padding-top:2px; padding-bottom:2px
462
463}
464
465ul#classifierlist{
466 float:left;
467 font-size: 14px;
468 text-align: left;
469 width: 15%;
470 margin:0;
471 padding:0;
472}
473
474div#classifiers{
475 float:left;
476 width: 75%;
477 margin:0;
478 padding:0 0 0 10px;
479 }
480
481ul#classifiernodelist li{
482 list-style: none;
483 margin: 0;
484 padding: 5px 0 0 0;
485 display: block;
486 }
487
488ul.childrenlist{
489 margin: 0 0 0 0;
490 padding: 0 0 0 20px;
491 display: block;
492 width: 100%;
493}
494
495div#content{
496 clear: both;
497 overflow: hidden;
498 margin: .2em 0 0 0;
499}
500
501/* bg image set in style macro */
502div.divbar {
503 clear: both;
504 background-image: url('../images/bg_green.png');
505 width: 100%;
506 text-align: center;
507 font-size:80%
508}
509
510
511/** query form style**/
512div#queryform{
513
514}
515
516/** search result style */
517div#terminfo{
518
519}
520
521div#matchdocs{
522
523}
524
525div.resultnavigation{
526 margin: 0;
527 padding:0;
528}
529
530ul#resultlist li{
531 display:block;
532}
533
534
535
536div#documentheading{
537 font-size: 16pt;
538 font-weight: bold;
539}
540
541div#documentinfo {
542 float:left;
543 padding:0;
544 margin:0;
545 width:24%;
546}
547
548div#toc{
549 float:left;
550 text-align:left;
551 width:60%;
552 padding:0;
553 margin:0;
554}
555
556ul#docbuttons li {
557 display: block;
558 font-size: 11px;
559 font-weight: bold;
560 background: #f7e7c5;
561 margin: 1px;
562 border: 1px solid #eeddbb;
563 text-align: center;
564 vertical-align: middle;
565 height: 30px; /* IE6 and NS4 treat width/height as min-width/min-height */
566 width: 110px;
567}
568
569
570ul#tocnodes li{
571 margin: 0;
572 padding: 5px 0 0 0;
573 display:block;
574}
575
576ul.tocnode {
577 margin:0;
578 padding:5px 0 0 20px;
579}
580
581ul.tocnode a{
582 margin: 0;
583 padding:0 5px 0 0;
584 }
585
586span.bold{
587 font-weight: bold;
588}
589
590div.documentarrows{
591 margin: 0 0 0 0;
592 padding: 1em 0 0 0;
593}
594
595img.lessarrow{
596 float:left;
597 border: none;
598}
599
600img.morearrow{
601 float:right;
602 border:none;
603}
604
605div.formheading{
606 font-size: 16pt;
607 font-weight: bold;
608 margin: .5em 0 0;
609 padding:0;
610}
611
612ul#presprefs li, ul#berrybasketprefs li, ul#searchprefs li{
613 display: block;
614}
615
616
617div.phrasebrowse{
618 text-align:center;
619 padding:0;
620 margin: .5em 0 .5em 0;
621}
622
623div.QuickSearch {
624 float: right;
625}
626
627#coverImage {
628 text-align: center;
629}
630
631/* ----- TABLE OF CONTENTS ------ */
632#tableOfContents {
633 margin: 0;
634 padding: 0;
635 font-size: 80%;
636}
637
638#tableOfContents li {
639 list-style: none;
640 margin: 0;
641 padding: 2px;
642 background-color: #fff;
643}
644
645#tableOfContents li a {
646 color: #444;
647}
648
649#tableOfContents li.current {
650 background-color: #090;
651}
652#tableOfContents li.current a {
653 color: #fff;
654}
655
656#tableOfContents li.current li {
657 background-color: #fff;
658}
659
660#tableOfContents li.current li a {
661 color: #444;
662}
663
664#tableOfContents ul {
665 padding: 0 0 0 20px;
666}
667
Note: See TracBrowser for help on using the repository browser.