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