blob: 235c85a1baa513fbb1e060a0c5ae164c25ce37ca [file] [log] [blame]
Patrick Williamsc124f4f2015-09-15 14:41:29 -05001/*
2 Generic XHTML / DocBook XHTML CSS Stylesheet.
3
4 Browser wrangling and typographic design by
5 Oyvind Kolas / pippin@gimp.org
6
7 Customised for Poky by
8 Matthew Allum / mallum@o-hand.com
9
10 Thanks to:
11 Liam R. E. Quin
12 William Skaggs
13 Jakub Steiner
14
15 Structure
16 ---------
17
18 The stylesheet is divided into the following sections:
19
20 Positioning
21 Margins, paddings, width, font-size, clearing.
22 Decorations
23 Borders, style
24 Colors
25 Colors
26 Graphics
27 Graphical backgrounds
28 Nasty IE tweaks
29 Workarounds needed to make it work in internet explorer,
30 currently makes the stylesheet non validating, but up until
31 this point it is validating.
32 Mozilla extensions
33 Transparency for footer
34 Rounded corners on boxes
35
36*/
37
38
39 /*************** /
40 / Positioning /
41/ ***************/
42
43body {
44 font-family: Verdana, Sans, sans-serif;
45
46 min-width: 640px;
47 width: 80%;
48 margin: 0em auto;
49 padding: 2em 5em 5em 5em;
50 color: #333;
51}
52
53h1,h2,h3,h4,h5,h6,h7 {
54 font-family: Arial, Sans;
55 color: #00557D;
56 clear: both;
57}
58
59h1 {
60 font-size: 2em;
61 text-align: left;
62 padding: 0em 0em 0em 0em;
63 margin: 2em 0em 0em 0em;
64}
65
66h2.subtitle {
67 margin: 0.10em 0em 3.0em 0em;
68 padding: 0em 0em 0em 0em;
69 font-size: 1.8em;
70 padding-left: 20%;
71 font-weight: normal;
72 font-style: italic;
73}
74
75h2 {
76 margin: 2em 0em 0.66em 0em;
77 padding: 0.5em 0em 0em 0em;
78 font-size: 1.5em;
79 font-weight: bold;
80}
81
82h3.subtitle {
83 margin: 0em 0em 1em 0em;
84 padding: 0em 0em 0em 0em;
85 font-size: 142.14%;
86 text-align: right;
87}
88
89h3 {
90 margin: 1em 0em 0.5em 0em;
91 padding: 1em 0em 0em 0em;
92 font-size: 140%;
93 font-weight: bold;
94}
95
96h4 {
97 margin: 1em 0em 0.5em 0em;
98 padding: 1em 0em 0em 0em;
99 font-size: 120%;
100 font-weight: bold;
101}
102
103h5 {
104 margin: 1em 0em 0.5em 0em;
105 padding: 1em 0em 0em 0em;
106 font-size: 110%;
107 font-weight: bold;
108}
109
110h6 {
111 margin: 1em 0em 0em 0em;
112 padding: 1em 0em 0em 0em;
113 font-size: 110%;
114 font-weight: bold;
115}
116
117.authorgroup {
118 background-color: transparent;
119 background-repeat: no-repeat;
120 padding-top: 256px;
121 background-position: top;
122 margin-top: -256px;
123 padding-right: 50px;
124 margin-left: 50px;
125 text-align: center;
126 width: 600px;
127}
128
129h3.author {
130 margin: 0em 0me 0em 0em;
131 padding: 0em 0em 0em 0em;
132 font-weight: normal;
133 font-size: 100%;
134 color: #333;
135 clear: both;
136}
137
138.author tt.email {
139 font-size: 66%;
140}
141
142.titlepage hr {
143 width: 0em;
144 clear: both;
145}
146
147.revhistory {
148 padding-top: 2em;
149 clear: both;
150}
151
152.toc,
153.list-of-tables,
154.list-of-examples,
155.list-of-figures {
156 padding: 1.33em 0em 2.5em 0em;
157 color: #00557D;
158}
159
160.toc p,
161.list-of-tables p,
162.list-of-figures p,
163.list-of-examples p {
164 padding: 0em 0em 0em 0em;
165 padding: 0em 0em 0.3em;
166 margin: 1.5em 0em 0em 0em;
167}
168
169.toc p b,
170.list-of-tables p b,
171.list-of-figures p b,
172.list-of-examples p b{
173 font-size: 100.0%;
174 font-weight: bold;
175}
176
177.toc dl,
178.list-of-tables dl,
179.list-of-figures dl,
180.list-of-examples dl {
181 margin: 0em 0em 0.5em 0em;
182 padding: 0em 0em 0em 0em;
183}
184
185.toc dt {
186 margin: 0em 0em 0em 0em;
187 padding: 0em 0em 0em 0em;
188}
189
190.toc dd {
191 margin: 0em 0em 0em 2.6em;
192 padding: 0em 0em 0em 0em;
193}
194
195div.glossary dl,
196div.variablelist dl {
197}
198
199.glossary dl dt,
200.variablelist dl dt,
201.variablelist dl dt span.term {
202 font-weight: normal;
203 width: 20em;
204 text-align: right;
205}
206
207.variablelist dl dt {
208 margin-top: 0.5em;
209}
210
211.glossary dl dd,
212.variablelist dl dd {
213 margin-top: -1em;
214 margin-left: 25.5em;
215}
216
217.glossary dd p,
218.variablelist dd p {
219 margin-top: 0em;
220 margin-bottom: 1em;
221}
222
223
224div.calloutlist table td {
225 padding: 0em 0em 0em 0em;
226 margin: 0em 0em 0em 0em;
227}
228
229div.calloutlist table td p {
230 margin-top: 0em;
231 margin-bottom: 1em;
232}
233
234div p.copyright {
235 text-align: left;
236}
237
238div.legalnotice p.legalnotice-title {
239 margin-bottom: 0em;
240}
241
242p {
243 line-height: 1.5em;
244 margin-top: 0em;
245
246}
247
248dl {
249 padding-top: 0em;
250}
251
252hr {
253 border: solid 1px;
254}
255
256
257.mediaobject,
258.mediaobjectco {
259 text-align: center;
260}
261
262img {
263 border: none;
264}
265
266ul {
267 padding: 0em 0em 0em 1.5em;
268}
269
270ul li {
271 padding: 0em 0em 0em 0em;
272}
273
274ul li p {
275 text-align: left;
276}
277
278table {
279 width :100%;
280}
281
282th {
283 padding: 0.25em;
284 text-align: left;
285 font-weight: normal;
286 vertical-align: top;
287}
288
289td {
290 padding: 0.25em;
291 vertical-align: top;
292}
293
294p a[id] {
295 margin: 0px;
296 padding: 0px;
297 display: inline;
298 background-image: none;
299}
300
301a {
302 text-decoration: underline;
303 color: #444;
304}
305
306pre {
307 overflow: auto;
308}
309
310a:hover {
311 text-decoration: underline;
312 /*font-weight: bold;*/
313}
314
315/* This style defines how the permalink character
316 appears by itself and when hovered over with
317 the mouse. */
318
319[alt='Permalink'] { color: #eee; }
320[alt='Permalink']:hover { color: black; }
321
322
323div.informalfigure,
324div.informalexample,
325div.informaltable,
326div.figure,
327div.table,
328div.example {
329 margin: 1em 0em;
330 padding: 1em;
331 page-break-inside: avoid;
332}
333
334
335div.informalfigure p.title b,
336div.informalexample p.title b,
337div.informaltable p.title b,
338div.figure p.title b,
339div.example p.title b,
340div.table p.title b{
341 padding-top: 0em;
342 margin-top: 0em;
343 font-size: 100%;
344 font-weight: normal;
345}
346
347.mediaobject .caption,
348.mediaobject .caption p {
349 text-align: center;
350 font-size: 80%;
351 padding-top: 0.5em;
352 padding-bottom: 0.5em;
353}
354
355.epigraph {
356 padding-left: 55%;
357 margin-bottom: 1em;
358}
359
360.epigraph p {
361 text-align: left;
362}
363
364.epigraph .quote {
365 font-style: italic;
366}
367.epigraph .attribution {
368 font-style: normal;
369 text-align: right;
370}
371
372span.application {
373 font-style: italic;
374}
375
376.programlisting {
377 font-family: monospace;
378 font-size: 80%;
379 white-space: pre;
380 margin: 1.33em 0em;
381 padding: 1.33em;
382}
383
384.tip,
385.warning,
386.caution,
387.note {
388 margin-top: 1em;
389 margin-bottom: 1em;
390
391}
392
393/* force full width of table within div */
394.tip table,
395.warning table,
396.caution table,
397.note table {
398 border: none;
399 width: 100%;
400}
401
402
403.tip table th,
404.warning table th,
405.caution table th,
406.note table th {
407 padding: 0.8em 0.0em 0.0em 0.0em;
408 margin : 0em 0em 0em 0em;
409}
410
411.tip p,
412.warning p,
413.caution p,
414.note p {
415 margin-top: 0.5em;
416 margin-bottom: 0.5em;
417 padding-right: 1em;
418 text-align: left;
419}
420
421.acronym {
422 text-transform: uppercase;
423}
424
425b.keycap,
426.keycap {
427 padding: 0.09em 0.3em;
428 margin: 0em;
429}
430
431.itemizedlist li {
432 clear: none;
433}
434
435.filename {
436 font-size: medium;
437 font-family: Courier, monospace;
438}
439
440
441div.navheader, div.heading{
442 position: absolute;
443 left: 0em;
444 top: 0em;
445 width: 100%;
446 background-color: #cdf;
447 width: 100%;
448}
449
450div.navfooter, div.footing{
451 position: fixed;
452 left: 0em;
453 bottom: 0em;
454 background-color: #eee;
455 width: 100%;
456}
457
458
459div.navheader td,
460div.navfooter td {
461 font-size: 66%;
462}
463
464div.navheader table th {
465 /*font-family: Georgia, Times, serif;*/
466 /*font-size: x-large;*/
467 font-size: 80%;
468}
469
470div.navheader table {
471 border-left: 0em;
472 border-right: 0em;
473 border-top: 0em;
474 width: 100%;
475}
476
477div.navfooter table {
478 border-left: 0em;
479 border-right: 0em;
480 border-bottom: 0em;
481 width: 100%;
482}
483
484div.navheader table td a,
485div.navfooter table td a {
486 color: #777;
487 text-decoration: none;
488}
489
490/* normal text in the footer */
491div.navfooter table td {
492 color: black;
493}
494
495div.navheader table td a:visited,
496div.navfooter table td a:visited {
497 color: #444;
498}
499
500
501/* links in header and footer */
502div.navheader table td a:hover,
503div.navfooter table td a:hover {
504 text-decoration: underline;
505 background-color: transparent;
506 color: #33a;
507}
508
509div.navheader hr,
510div.navfooter hr {
511 display: none;
512}
513
514
515.qandaset tr.question td p {
516 margin: 0em 0em 1em 0em;
517 padding: 0em 0em 0em 0em;
518}
519
520.qandaset tr.answer td p {
521 margin: 0em 0em 1em 0em;
522 padding: 0em 0em 0em 0em;
523}
524.answer td {
525 padding-bottom: 1.5em;
526}
527
528.emphasis {
529 font-weight: bold;
530}
531
532
533 /************* /
534 / decorations /
535/ *************/
536
537.titlepage {
538}
539
540.part .title {
541}
542
543.subtitle {
544 border: none;
545}
546
547/*
548h1 {
549 border: none;
550}
551
552h2 {
553 border-top: solid 0.2em;
554 border-bottom: solid 0.06em;
555}
556
557h3 {
558 border-top: 0em;
559 border-bottom: solid 0.06em;
560}
561
562h4 {
563 border: 0em;
564 border-bottom: solid 0.06em;
565}
566
567h5 {
568 border: 0em;
569}
570*/
571
572.programlisting {
573 border: solid 1px;
574}
575
576div.figure,
577div.table,
578div.informalfigure,
579div.informaltable,
580div.informalexample,
581div.example {
582 border: 1px solid;
583}
584
585
586
587.tip,
588.warning,
589.caution,
590.note {
591 border: 1px solid;
592}
593
594.tip table th,
595.warning table th,
596.caution table th,
597.note table th {
598 border-bottom: 1px solid;
599}
600
601.question td {
602 border-top: 1px solid black;
603}
604
605.answer {
606}
607
608
609b.keycap,
610.keycap {
611 border: 1px solid;
612}
613
614
615div.navheader, div.heading{
616 border-bottom: 1px solid;
617}
618
619
620div.navfooter, div.footing{
621 border-top: 1px solid;
622}
623
624 /********* /
625 / colors /
626/ *********/
627
628body {
629 color: #333;
630 background: white;
631}
632
633a {
634 background: transparent;
635}
636
637a:hover {
638 background-color: #dedede;
639}
640
641
642h1,
643h2,
644h3,
645h4,
646h5,
647h6,
648h7,
649h8 {
650 background-color: transparent;
651}
652
653hr {
654 border-color: #aaa;
655}
656
657
658.tip, .warning, .caution, .note {
659 border-color: #fff;
660}
661
662
663.tip table th,
664.warning table th,
665.caution table th,
666.note table th {
667 border-bottom-color: #fff;
668}
669
670
671.warning {
672 background-color: #f0f0f2;
673}
674
675.caution {
676 background-color: #f0f0f2;
677}
678
679.tip {
680 background-color: #f0f0f2;
681}
682
683.note {
684 background-color: #f0f0f2;
685}
686
687.glossary dl dt,
688.variablelist dl dt,
689.variablelist dl dt span.term {
690 color: #044;
691}
692
693div.figure,
694div.table,
695div.example,
696div.informalfigure,
697div.informaltable,
698div.informalexample {
699 border-color: #aaa;
700}
701
702pre.programlisting {
703 color: black;
704 background-color: #fff;
705 border-color: #aaa;
706 border-width: 2px;
707}
708
709.guimenu,
710.guilabel,
711.guimenuitem {
712 background-color: #eee;
713}
714
715
716b.keycap,
717.keycap {
718 background-color: #eee;
719 border-color: #999;
720}
721
722
723div.navheader {
724 border-color: black;
725}
726
727
728div.navfooter {
729 border-color: black;
730}
731
732
733 /*********** /
734 / graphics /
735/ ***********/
736
737/*
738body {
739 background-image: url("images/body_bg.jpg");
740 background-attachment: fixed;
741}
742
743.navheader,
744.note,
745.tip {
746 background-image: url("images/note_bg.jpg");
747 background-attachment: fixed;
748}
749
750.warning,
751.caution {
752 background-image: url("images/warning_bg.jpg");
753 background-attachment: fixed;
754}
755
756.figure,
757.informalfigure,
758.example,
759.informalexample,
760.table,
761.informaltable {
762 background-image: url("images/figure_bg.jpg");
763 background-attachment: fixed;
764}
765
766*/
767h1,
768h2,
769h3,
770h4,
771h5,
772h6,
773h7{
774}
775
776/*
777Example of how to stick an image as part of the title.
778
779div.article .titlepage .title
780{
781 background-image: url("figures/white-on-black.png");
782 background-position: center;
783 background-repeat: repeat-x;
784}
785*/
786
787div.preface .titlepage .title,
788div.colophon .title,
789div.chapter .titlepage .title,
790div.article .titlepage .title
791{
792}
793
794div.section div.section .titlepage .title,
795div.sect2 .titlepage .title {
796 background: none;
797}
798
799
800h1.title {
801 background-color: transparent;
802 background-repeat: no-repeat;
803 height: 256px;
804 text-indent: -9000px;
805 overflow:hidden;
806}
807
808h2.subtitle {
809 background-color: transparent;
810 text-indent: -9000px;
811 overflow:hidden;
812 width: 0px;
813 display: none;
814}
815
816 /*************************************** /
817 / pippin.gimp.org specific alterations /
818/ ***************************************/
819
820/*
821div.heading, div.navheader {
822 color: #777;
823 font-size: 80%;
824 padding: 0;
825 margin: 0;
826 text-align: left;
827 position: absolute;
828 top: 0px;
829 left: 0px;
830 width: 100%;
831 height: 50px;
832 background: url('/gfx/heading_bg.png') transparent;
833 background-repeat: repeat-x;
834 background-attachment: fixed;
835 border: none;
836}
837
838div.heading a {
839 color: #444;
840}
841
842div.footing, div.navfooter {
843 border: none;
844 color: #ddd;
845 font-size: 80%;
846 text-align:right;
847
848 width: 100%;
849 padding-top: 10px;
850 position: absolute;
851 bottom: 0px;
852 left: 0px;
853
854 background: url('/gfx/footing_bg.png') transparent;
855}
856*/
857
858
859
860 /****************** /
861 / nasty ie tweaks /
862/ ******************/
863
864/*
865div.heading, div.navheader {
866 width:expression(document.body.clientWidth + "px");
867}
868
869div.footing, div.navfooter {
870 width:expression(document.body.clientWidth + "px");
871 margin-left:expression("-5em");
872}
873body {
874 padding:expression("4em 5em 0em 5em");
875}
876*/
877
878 /**************************************** /
879 / mozilla vendor specific css extensions /
880/ ****************************************/
881/*
882div.navfooter, div.footing{
883 -moz-opacity: 0.8em;
884}
885
886div.figure,
887div.table,
888div.informalfigure,
889div.informaltable,
890div.informalexample,
891div.example,
892.tip,
893.warning,
894.caution,
895.note {
896 -moz-border-radius: 0.5em;
897}
898
899b.keycap,
900.keycap {
901 -moz-border-radius: 0.3em;
902}
903*/
904
905table tr td table tr td {
906 display: none;
907}
908
909
910hr {
911 display: none;
912}
913
914table {
915 border: 0em;
916}
917
918 .photo {
919 float: right;
920 margin-left: 1.5em;
921 margin-bottom: 1.5em;
922 margin-top: 0em;
923 max-width: 17em;
924 border: 1px solid gray;
925 padding: 3px;
926 background: white;
927}
928 .seperator {
929 padding-top: 2em;
930 clear: both;
931 }
932
933 #validators {
934 margin-top: 5em;
935 text-align: right;
936 color: #777;
937 }
938 @media print {
939 body {
940 font-size: 8pt;
941 }
942 .noprint {
943 display: none;
944 }
945 }
946
947
948.tip,
949.note {
950 background: #f0f0f2;
951 color: #333;
952 padding: 20px;
953 margin: 20px;
954}
955
956.tip h3,
957.note h3 {
958 padding: 0em;
959 margin: 0em;
960 font-size: 2em;
961 font-weight: bold;
962 color: #333;
963}
964
965.tip a,
966.note a {
967 color: #333;
968 text-decoration: underline;
969}
970
971.footnote {
972 font-size: small;
973 color: #333;
974}
975
976/* Changes the announcement text */
977.tip h3,
978.warning h3,
979.caution h3,
980.note h3 {
981 font-size:large;
982 color: #00557D;
983}