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

Last change on this file since 24009 was 24009, checked in by sjm84, 13 years ago

Another round of improvements to the oran skin including a tree view of the classifiers

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