source: main/trunk/greenstone3/web/interfaces/default/style/core.css@ 26395

Last change on this file since 26395 was 26395, checked in by sjm84, 12 years ago

View options will now react like buttons when the cursor goes over them

File size: 12.3 KB
Line 
1html {
2 height: 100%;
3 margin-bottom: 1px;
4}
5body {
6 font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
7 margin: 0;
8 background-color: #eae4d9;
9}
10
11h3 {
12 margin-top:2px;
13 margin-bottom:2px;
14}
15
16p {
17 margin-top:0px;
18 margin-bottom:0.75em;
19}
20
21pre {
22 white-space: pre-wrap; /* css-3 */
23 white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
24 white-space: -pre-wrap; /* Opera 4-6 */
25 white-space: -o-pre-wrap; /* Opera 7 */
26 word-wrap: break-word; /* Internet Explorer 5.5+ */
27}
28
29.sectionHeader {
30 margin-top:0px;
31 margin-bottom:0px;
32}
33
34.headerTD {
35 vertical-align: middle;
36}
37
38/* Styles for the different depths */
39.sectionHeaderDepthTitle{
40 font-size:1.4em;
41 line-height:1em;
42 font-weight:bold;
43}
44
45.sectionHeaderDepth1{
46 font-size:1.3em;
47 line-height:1em;
48 font-weight:bold;
49}
50
51.sectionHeaderDepth2{
52 font-size:1.2em;
53 line-height:1em;
54 font-weight:bold;
55 font-style:italic;
56}
57
58.sectionHeaderDepth3{
59 font-size:1.1em;
60 line-height:1em;
61 font-style:italic;
62}
63
64.sectionHeaderDepth4{
65 font-size:1em;
66 line-height:1em;
67 font-weight:italic;
68}
69
70.sectionNumberSpan{
71 /*Comment out this line to enable automatic section numbering*/
72 display:none;
73}
74
75.sectionContainer{
76 padding-top:0.5em;
77 padding-bottom:1em;
78 padding-left:1.5em;
79}
80
81.classifierContainer {
82 padding-left:1.5em;
83}
84
85.horizontalContainer {
86 padding-left:0px;
87 margin:0px;
88}
89
90.selectedHorizontalClassifierNode a{
91 font-weight: bold;
92 text-decoration: none;
93}
94
95.horizontalClassifierNode {
96 padding:0px 0px 10px 10px;
97 list-style:none;
98 display: inline-block;
99}
100
101.icon{
102 cursor:pointer;
103 padding:2px;
104 border:0px;
105}
106
107.emptyIcon {
108 height:16px;
109 width:16px;
110}
111
112.backToTop {
113 font-size:0.7em;
114 padding-left: 2em;
115 text-align:center;
116}
117
118.hidden{
119 display:none;
120}
121
122#prevArrowTD {
123 text-align:right;
124 width:10%;
125}
126
127#nextArrowTD {
128 text-align:left;
129 width:10%;
130}
131
132#prevTD {
133 text-align:left;
134 width:20%;
135}
136
137#nextTD {
138 text-align:right;
139 width:20%;
140}
141
142#searchResultNavTable {
143 width:100%;
144}
145
146#searchResultsStatusBar {
147 text-align:center;
148}
149
150#container {
151 position: relative;
152 margin: 0 auto 20px auto;
153 max-width: 1000px;
154 padding: 0;
155 line-height: 120%;
156 background-color: #fff;
157 border-top-width: 0px;
158}
159
160#topArea {
161 border: none;
162 max-width: 1000px;
163 margin: 20px auto 0;
164}
165
166#topArea table {
167 width: 100%;
168}
169
170#topArea td {
171 width: 50%;
172}
173
174#gs_banner {
175 padding:0px;
176 position: relative;
177 border: 0px;
178}
179
180#gs_content {
181 margin-top:-10px;
182 padding: 20px 20px 10px;
183 min-height: 300px;
184}
185
186#gs_footer {
187 position: relative;
188 display: block;
189 margin: -1px auto;
190 text-align: center;
191 vertical-align: middle;
192 font-size: 70%;
193 padding-top:5px;
194 padding-bottom:5px;
195}
196
197.termList {
198 font-size:12px;
199 line-height:14px;
200}
201
202.noTermHighlight{
203
204}
205
206.termHighlight{
207 background:yellow;
208}
209
210#viewAndZoomOptions {
211 margin-bottom:10px;
212 border:0px;
213}
214
215#viewOptions {
216 margin: 0px;
217 padding: 0px;
218}
219
220#viewOptions li {
221 list-style:none;
222 float:left;
223 padding: 5px;
224 cursor:pointer;
225}
226
227.tableOfContentsTitle{
228 font-weight:bold;
229 text-align:left;
230}
231
232.viewOptions a:link, .viewOptions a:hover, .viewOptions a:active, .viewOptions a:visited {
233 text-decoration:none;
234}
235
236#rightSidebar {
237 width: 30%;
238 min-width:180px;
239 float:right;
240 margin: 0 0 10px 20px;
241}
242
243#contentsArea {
244 padding:0px 10px;
245}
246
247#collectionLinks {
248 position: relative;
249}
250
251#collectionLinks a div{
252 display: block;
253 float: left;
254 border: 1px solid #888;
255 margin: 0 20px 20px 0;
256 font-size: 150%;
257 color: #444;
258 text-decoration: none;
259 background: url(../images/collectionIconStripe.gif) scroll no-repeat 0 0;
260 padding: 20px;
261 min-width: 200px;
262}
263
264#collectionLinks a img{
265 display: block;
266 float: left;
267 border: 1px solid #888;
268 margin: 0 20px 20px 0;
269 font-size: 150%;
270 color: #444;
271 text-decoration: none;
272 height:60px;
273}
274
275/*
276.collectionLink {
277 display: block;
278 float: left;
279 border: 1px solid #888;
280 margin: 0 20px 20px 0;
281 font-size: 150%;
282 color: #444;
283 text-decoration: none;
284 background: url(../images/collectionIconStripe.gif) scroll no-repeat 0 0;
285 padding: 20px;
286}
287*/
288
289/* some text should not be rendered as it is just there for search engines */
290#collectionLinks a b {
291 display: none;
292}
293
294/* make sure h1s and h2s are readable on the green banner */
295#breadcrumbs, #gs_banner h2, #breadcrumbs a, #gs_banner h2 a {
296 /*color: #fff;*/
297}
298body.dAction #gs_banner h2 {
299 max-width: 600px;
300 font-size: 100;
301}
302
303#titlesearchcontainer {
304 padding-top: 20px;
305 width: 100%;
306}
307
308#titlesearchcontainer, #titlesearchcontainer form, #titlesearchcontainer h2{
309 margin-top: 0px;
310 margin-bottom: 0px;
311}
312
313#titlearea {
314 float: left;
315 padding-left: 20px;
316}
317
318#titlearea h2{
319 padding-left: 0px;
320 padding-bottom: 20px;
321}
322
323#quicksearcharea {
324 float: right;
325 text-align: right;
326 padding-right: 20px;
327}
328
329#quicksearcharea ul{
330 margin:0;
331}
332
333#quicksearcharea li{
334 display:inline;
335 list-style:none;
336 margin-left:5px;
337 padding: 2px 3px 2px 5px;
338 font-size: 10px;
339}
340
341#quicksearcharea a{
342 text-transform:lowercase;
343}
344
345#breadcrumbs {
346 margin-left: 20px;
347}
348
349#breadcrumbs a{
350 text-decoration:underline;
351}
352
353
354/* css to make the page links work (home, help, preference) */
355#bannerLinks {
356 text-align: right;
357 list-style: none;
358 margin: 0 20px;
359 font-size: 90%;
360}
361
362#bannerLinks li {
363 /*display: inline;*/
364 float:right;
365 margin-left: 5px;
366 padding: 1px 4px 1px 0px;
367}
368
369#bannerLinks ul {
370 padding: 0px 3px 0px 0px;
371 text-align: right;
372 list-style: none;
373}
374
375#bannerLinks li.current a {
376 cursor: default;
377}
378
379#bannerLinks li:hover, #bannerLinks li.current { background-position: 100% 0; }
380
381#bannerLinks li.current a { text-decoration: underline; background-position: 0 0;}
382#bannerLinks img.spacer { display: table-cell; }
383
384
385/* css to make the classifier list pretty */
386.navList {
387 margin: 0 0 10px 0;
388 padding: 0;
389 background-color: #0a0;
390}
391
392.navList ul {
393 margin: 0;
394 padding: 0;
395 list-style: none;
396}
397
398.navList td {
399 /*float: left;*/
400 padding-left: 3em;
401 padding-right: 3em;
402 text-align:center;
403 cursor: pointer;
404 color: #fff;
405}
406.navList li a, .navList li span {
407 padding: 0 1em;
408 display: block;
409 text-decoration: none;
410 color: #fff;
411}
412
413.navList td.current {
414 background-color: #efea6e;
415 color: #444;
416 cursor: default;
417}
418
419.navList li.current a, .navList li.current span {
420 color: #444;
421 cursor: default;
422}
423
424/* css to make the tabs work */
425#gs-nav {
426 list-style: none outside none;
427 padding: 0px;
428 margin: 0 0 0 20px;
429 font-size: 14px;
430}
431
432#gs-nav ul {
433 margin:0px;
434 padding:0px;
435}
436
437#gs-nav li {
438 float:left;
439 display: inline;
440 margin-right: 5px;
441 padding: 3px 5px 5px 7px;
442 text-transform: capitalize;
443 text-align: center;
444 border-bottom: 0px;
445}
446
447#gs-nav a{
448 margin:0px;
449 font-weight: bold;
450 text-decoration: none;
451}
452
453#gs-nav li:hover, #gs-nav li.current { background-position: 100% 0; }
454#gs-nav li:hover a, #gs-nav li.current a { background-position: 0 0; cursor:default; }
455
456/* style the search and classifier results */
457#resultsTable {
458 line-height: 160%;
459 margin: 0;
460 padding: 0;
461 /* border: 1px solid #f00; */
462}
463
464#resultsTable ul {
465 margin: 0 0 0 20px;
466 padding: 0;
467}
468
469#resultsTable li {
470 list-style: none;
471 margin: 0 0 .2em 0;
472 /* border: 1px solid #00f; */
473}
474
475#resultsTable li a {
476 padding: 3px 3px 3px 3px;
477 background-repeat: no-repeat;
478 background-position: 0 .1em;
479}
480
481
482#resultsTable .document a { /*background-image: url('../images/book.png'); */}
483#resultsTable .document a:visited { background-image: url('../images/book-visited.png'); color: #999; }
484#resultsTable .shelf>a { background-image: url('../images/bookshelf.png'); }
485
486/* corners of the banner */
487/*
488.corner {
489 position: absolute;
490 background-image: url('../images/layout/corners.png');
491 background-repeat: no-repeat;
492 width: 20px;
493 height: 20px;
494}
495
496#cornerTopLeft {
497 left: 0; top: 0;
498 background-position: 0 0;
499}
500#cornerTopRight {
501 right: 0; top: 0;
502 background-position: -20px 0;
503}
504#cornerBottomLeft {
505 left: 0; bottom: 0;
506 background-position: 0 -20px;
507}
508#cornerBottomRight {
509 right: 0; bottom: 0;
510 background-position: -20px -20px;
511}
512*/
513.clear {
514 clear: both;
515}
516
517
518/*a:link, a:hover, a:active, a:visited { color: #050; }*/
519
520/* bg image set in style macro */
521div.divbar {
522 clear: both;
523 background-image: url('../images/bg_green.png');
524 width: 100%;
525 text-align: center;
526 font-size:80%
527}
528
529
530/** query form style**/
531div#queryform{
532
533}
534
535/** search result style */
536div#terminfo{
537
538}
539
540div#matchdocs{
541
542}
543
544div.resultnavigation{
545 margin: 0;
546 padding:0;
547}
548
549ul#resultlist li{
550 display:block;
551}
552
553div#documentheading{
554 font-size: 16pt;
555 font-weight: bold;
556}
557
558div#documentinfo {
559 float:left;
560 padding:0;
561 margin:0;
562 width:24%;
563}
564
565div#toc{
566 float:left;
567 text-align:left;
568 width:60%;
569 padding:0;
570 margin:0;
571}
572
573ul#docbuttons li {
574 display: block;
575 font-size: 11px;
576 font-weight: bold;
577 background: #f7e7c5;
578 margin: 1px;
579 border: 1px solid #eeddbb;
580 text-align: center;
581 vertical-align: middle;
582 height: 30px; /* IE6 and NS4 treat width/height as min-width/min-height */
583 width: 110px;
584}
585
586
587ul#tocnodes li{
588 margin: 0;
589 padding: 5px 0 0 0;
590 display:block;
591}
592
593ul.tocnode {
594 margin:0;
595 padding:5px 0 0 20px;
596}
597
598ul.tocnode a{
599 margin: 0;
600 padding:0 5px 0 0;
601 }
602
603span.bold{
604 font-weight: bold;
605}
606
607div.documentarrows{
608 margin: 0 0 0 0;
609 padding: 1em 0 0 0;
610}
611
612img.lessarrow{
613 float:left;
614 border: none;
615}
616
617img.morearrow{
618 float:right;
619 border:none;
620}
621
622div.formheading{
623 font-size: 16pt;
624 font-weight: bold;
625 margin: .5em 0 0;
626 padding:0;
627}
628
629ul#presprefs li, ul#berrybasketprefs li, ul#searchprefs li{
630 display: block;
631}
632
633
634div.phrasebrowse{
635 text-align:center;
636 padding:0;
637 margin: .5em 0 .5em 0;
638}
639
640div.QuickSearch {
641 float: right;
642}
643
644#coverImage {
645 text-align: center;
646 margin: 20px;
647}
648
649/* ----- TABLE OF CONTENTS ------ */
650.tocTable {
651 width: 100%;
652 background: white !important;
653}
654
655.tocTextCell {
656 padding-left:5px;
657}
658
659.tableOfContentsContainer {
660 padding:1px;
661 max-height:500px;
662 overflow:auto;
663}
664
665#tableOfContents {
666 margin: 0;
667 padding: 0;
668 font-size: 70%;
669}
670
671#tableOfContents li {
672 list-style: none;
673 margin: 0;
674 padding: 2px;
675}
676
677#tableOfContents a {text-decoration: underline; color: #444 !important;}
678#tableOfContents a:visited{text-decoration: underline; color: #444 !important;}
679#tableOfContents a:link{text-decoration: underline; color: #444 !important;}
680
681#tableOfContents li.current {
682 background-color: #090;
683}
684#tableOfContents li.current a {
685 color: #fff;
686}
687
688#tableOfContents li.current li {
689 background-color: #fff;
690}
691
692#tableOfContents li.current li a {
693 color: #444;
694}
695
696#tableOfContents ul {
697 padding: 0 0 0 0;
698}
699
700#tableOfContents ul ul{
701 padding: 0 0 0 0;
702}
703
704#tableOfContents ul ul ul{
705 padding: 0 0 0 16px;
706}
707
708/* -------- SEARCH ------- */
709.paramLabel {
710 margin: 2px;
711 float: left;
712 min-width: 250px;
713}
714.paramValue {
715 margin: 2px;
716 float: left;
717}
718
719
720table{
721 border-collapse:collapse;
722 border-spacing:0;
723}
724
725/* ------- BROWSE -------*/
726
727.childrenlist {
728 margin:0 0 0 10px;
729
730}
731.childrenlist td {
732 padding:3px 0px 0px 10px;
733}
734
735/* ------- PAGED IMAGE ------- */
736
737.pageSlider {
738 width: 250px;
739 overflow: auto;
740 margin-left: auto;
741 margin-right: auto;
742 padding: 2px;
743}
744
745.pageSliderSpacer {
746 width:2px;
747}
748
749.pageSliderCol {
750 height:100px;
751 padding: 2px;
752 text-align: center;
753 vertical-align: top;
754}
755
756/* ------- SPATIAL COLLECTIONS ------- */
757
758#nearbyDocs td, #nearbyDocs th {
759 padding: 5px;
760 border: 1px solid black;
761}
762
763#nearbyDocs th {
764 font-weight: bold;
765}
766
767#auth_navbar {
768 width: 90%;
769 margin: 10px auto;
770}
771
772#auth_navbar span{
773 padding:3px;
774}
775
776#userListTable {
777 text-align: center;
778 width: 90%;
779 margin: auto;
780}
781
782#userListTable td{
783 border: black 1px solid;
784 padding: 5px;
785}
786
787#gs_error{
788 padding: 5px;
789 margin: auto;
790 width: 50%;
791 text-align: center;
792}
793
794#loginTable{
795 margin: auto;
796 width: 25%;
797}
798
799.map_canvas_full{
800 margin:0px auto;
801 width:900px;
802 height:500px;
803}
804
805.map_canvas_half{
806 float: right;
807 width:450px;
808 height:500px;
809}
810
811dl dt { font-weight:bold;
812 padding-top:10px; }
813dl dd { padding-bottom:10px}
814
815#facetSelector{
816 padding: 0px;
817 width:30%;
818 float:right;
819}
820
821.facetTable{
822 list-style:none;
823 margin: 0px 0px 20px;
824 padding: 0px;
825 overflow:auto;
826}
827
828.facetTable li{
829 margin-bottom:5px;
830}
831
832.checkboxList{
833 list-style:none;
834 padding-left:0px;
835}
836
837.facetedResults{
838 float:left;
839 width:65%;
840}
841
842.slideshowImage{
843 width:100%;
844}
845
846/*
847ul.childrenlist li {
848list-style-type:none;
849}
850ul#classifierlist,ul#classifiernodelist {
851 list-style-type:none;
852 margin:0;
853 padding:0
854}
855ul#classifierlist li{
856list-style:none;
857margin:0 0 5px 0;
858padding:0;display:block;
859}
860ul#classifiernodelist li{
861list-style:none;
862margin:0;
863padding:5px 0 0 0;
864display:block
865}
866ul.childrenlist{
867list-style:none;
868margin:0;
869padding:0 0 0 20px;
870display:block;
871width:100%
872}
873*/
Note: See TracBrowser for help on using the repository browser.