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