xref: /haiku/docs/user/book.css (revision d63ed5844d997a61afd7a6c4b7c9fad0dc01e9f3)
1/*
2 * Copyright 2008-2013 Haiku, Inc. All rights reserved.
3 * Distributed under the terms of the MIT License.
4 *
5 * Authors:
6 *		François Revol, revol@free.fr
7 *		Stephan Aßmus, superstippi@gmx.de
8 *		Braden Ewing, brewin@gmail.com
9 *		Humdinger, humdingerb@gmail.com
10 *		John Scipione, jscipione@gmail.com
11 */
12
13/* color names provided by: https://chir.ag/projects/name-that-color */
14
15html {
16	overflow-x: hidden;
17	overflow-y: scroll;
18}
19
20body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,
21	p,blockquote,th,td {
22	margin: 0;
23	padding: 0;
24}
25
26body {
27	color: #333333; /* mine shaft */
28	background-color: white;
29	font-size: 14.4px;
30	font-family: "Noto Sans", Arial, sans-serif;
31}
32
33h1, h2, h3, h4, h5, h6 {
34	color: #0c3762; /* madison */
35	margin-top: 1em;
36	margin-bottom: 1em;
37}
38
39h1 {
40	font-size: 1.3em;
41	font-weight: bold;
42	border-bottom: dotted thin #c0c0c0; /* silver */
43}
44
45h2 {
46	font-size: 1.3em;
47	font-weight: normal;
48	border-bottom: dotted thin #c0c0c0; /* silver */
49}
50
51h3 {
52	font-size: 1.2em;
53	font-weight: normal;
54	border-bottom: dotted thin #c0c0c0; /* silver */
55}
56
57h4 {
58	font-size: 1.1em;
59	font-weight: normal;
60}
61
62h5, h6 {
63	font-size: 1.0em;
64	font-weight: normal;
65}
66
67p {
68	margin-top: 0.5em;
69	margin-bottom: 0.5em;
70}
71
72table {
73	border-collapse: collapse;
74	border-spacing: 0;
75}
76
77td, th {
78	vertical-align: top;
79	text-align: left;
80	padding: 4px;
81}
82
83caption {
84	text-align:left;
85}
86
87fieldset,img {
88	border: 0;
89}
90
91q:before,q:after {
92	content: '';
93}
94
95abbr,acronym {
96	border: 0;
97}
98
99a:link {
100	font-weight: bold;
101	text-decoration: none;
102	color: #dc3c01; /* grenadier */
103}
104
105a:visited {
106	font-weight: bold;
107	text-decoration: none;
108	color: #892601; /* peru tan */
109}
110
111a:hover, a:active {
112	text-decoration: underline;
113	color: #ff4500; /* vermilion */
114}
115
116dl.since {
117	margin-top: 1em;
118}
119
120dl.since dt {
121	display: inline;
122	padding-right: 0.5em;
123}
124
125dl.since dd {
126	display: inline;
127}
128
129
130/* Some headers act as anchors, don't give them a hover effect */
131
132h1 a:hover, a:active, h2 a:hover, a:active, h3 a:hover, a:active,
133h4 a:hover, a:active, h5 a:hover, a:active, h6 a:hover, a:active {
134	text-decoration: none;
135	color: #0c3762; /* madison */
136}
137
138/* Custom Header */
139
140#banner {
141	position: relative;
142	top: 0;
143	left: 0;
144	height: 84px;
145	background: #eeeeee; /* gallery */
146}
147
148#banner div.logo {
149	background: url('https://api.haiku-os.org/logo.png') no-repeat scroll 0 0 transparent;
150	min-width: 59em;
151	max-width: 70em;
152	height: 100%;
153	margin: 0 auto;
154}
155
156#banner span.subtitle {
157	position: relative;
158	top: 48px;
159	left: 272px;
160	color: #333333; /* mine shaft */
161	text-transform: uppercase;
162	letter-spacing: 3px;
163	font-family: Myriad Pro,Myriad Web Pro Regular,Lucida Grande,Geneva,Trebuchet MS,sans-serif;
164	font-weight: normal;
165}
166
167#banner span.search {
168	position: relative;
169	top: 48px;
170	left: 462px;
171}
172
173input[type=text], input[type=password] {
174	font-size: inherit;
175	border-top: 1px solid #818181;
176	border-left: 1px solid #818181;
177	border-bottom: 1px solid #858585;
178	border-right: 1px solid #858585;
179	margin-top: 3px;
180	padding: 2px;
181	width: 200px;
182}
183
184div.header {
185	margin-top: 20px;
186	margin: 10px auto;
187	min-width: 59em;
188	max-width: 70em;
189}
190
191div.summary {
192	margin: 0 auto;
193	min-width: 59em;
194	max-width: 70em;
195
196	display: none;
197}
198
199div.headertitle {
200	min-width: 59em;
201	max-width: 70em;
202}
203
204div.headertitle div.title {
205	color: #0c3762; /* madison */
206	font-size: 1.3em;
207	font-weight: bold;
208	border-bottom: dotted thin #c0c0c0; /* silver */
209	margin-top: 1em;
210	margin-bottom: 1em;
211}
212
213.ingroups {
214	margin-top: 10px;
215}
216
217/* Navigation Tabs */
218
219div.tabs, div.tabs2, div.tabs3 {
220	position: relative;
221	left: 0;
222	top: 0;
223	background: #e0e0e0; /* alto */
224	margin: 0;
225	padding: 0;
226}
227
228div.tabs ul.tablist, div.tabs2 ul.tablist, div.tabs3 ul.tablist {
229	margin: 0 auto;
230	padding-top: 3px;
231	padding-bottom: 2px;
232	list-style: none;
233	min-width: 59em;
234	max-width: 70em;
235}
236
237div.navpath {
238	margin: 20px auto;
239	min-width: 59em;
240	max-width: 70em;
241}
242
243div.navpath ul {
244	list-style: none;
245}
246
247div.navpath ul li {
248	padding-top: 3px;
249	padding-bottom: 2px;
250}
251
252div.tabs ul.tablist {
253}
254
255div.tabs2 ul.tablist {
256}
257
258div.tabs3 ul.tablist {
259}
260
261div.tabs ul.tablist li, div.tabs2 ul.tablist li, div.tabs3 ul.tablist li {
262	display: inline;
263	margin: 0px;
264	padding: 0px;
265	font-size: 0.8em;
266}
267
268div.tabs ul.tablist li span, div.tabs2 ul.tablist li span,
269	div.tabs3 ul.tablist li span {
270	display: inline;
271	padding-right: 9px;
272	white-space: nowrap;
273}
274
275div.tabs ul.tablist li li.current a, div.tabs2 ul.tablist li li.current a,
276	div.tabs3 ul.tablist li li.current a {
277	color: black;
278	text-decoration: none;
279}
280
281/* Contents div */
282
283div.contents, footer {
284	line-height: 1.5;
285	margin: 10px auto;
286	min-width: 59em;
287	max-width: 70em;
288}
289
290div.contents ul, div.contents ol {
291	line-height: 1.3;
292}
293
294div.contents em, div.contents code {
295	font-weight: normal;
296	font-style: normal;
297}
298
299div.contents em {
300	color: #dc3c01; /* grenadier */
301}
302
303div.contents code {
304	color: blue;
305}
306
307div.contents td {
308	line-height: 1.3;
309}
310
311div.contents code {
312	color: blue;
313	font-family: "Deja Vu Mono", Courier, "Courier New", monospace, fixed;
314	font-weight: normal;
315	font-style: normal;
316}
317
318div.contents div.dynheader {
319	color: #0c3762; /* madison */
320	font-size: 1.3em;
321	font-weight: normal;
322	border-bottom: dotted thin #c0c0c0; /* silver */
323	margin-top: 1em;
324	margin-bottom: 1em;
325}
326
327div.contents div.dyncontent {
328	width: 100%;
329	border: 1px solid #c7c7c7; /* silver */
330	overflow: auto;
331}
332
333div.contents div.dyncontent div.center {
334	text-align: center;
335	margin: 16px;
336}
337
338div.contents span.keycap, div.contents span.keysym {
339	-webkit-border-radius: 3px;
340	-khtml-border-radius: 3px;
341	-moz-border-radius: 3px;
342	border-radius: 3px;
343	border-color: #c7c7c7; /* silver */
344	border-style: solid;
345	border-width: 1px;
346	padding: 0px 2px 0px 2px;
347	background-color: #e8e8e8; /* mercury */
348	font-family: serif;
349	font-variant: small-caps;
350}
351
352div.contents div.textblock {
353	margin-bottom: 20px;
354}
355
356div.contents hr {
357	display: none;
358}
359
360div.contents li {
361	line-height: 1.3;
362	margin-bottom: 10px;
363	margin-left: 20px;
364}
365
366div.contents dt {
367	margin-top: 16px;
368	margin-bottom: 8px;
369}
370
371/* The boxes from the userguide */
372dl.note, dl.remark, dl.warning, dl.attention {
373	border-style: solid;
374	border-width: 2px;
375	margin-top: 24px;
376	margin-bottom: 24px;
377	padding: 4px;
378	min-height: 48px;
379}
380
381dl.note dd, dl.remark dd, dl.warning dd, dl.attention dd {
382	font-size: 12px;
383}
384
385dl.note {
386	/* rice flower */
387	background:#e4ffde url('https://haiku-os.org/sites/haiku-os.org/themes/shijin/haiku-icons/alert_info_32.png') 15px 15px no-repeat;
388	border-color: #94ce18; /* lima */
389}
390
391dl.remark {
392	background: #f3f3f3 url('https://api.haiku-os.org/images/alert_idea_32.png') 15px 15px no-repeat;
393	border-color: #c0c0c0; /* silver */
394}
395
396dl.warning {
397	/* lemon chiffon */
398	background: #fffbc6 url('https://api.haiku-os.org/images/alert_warning_32.png') 15px 15px no-repeat;
399	border-color: #eed300; /* gold */
400}
401
402dl.attention {
403	/* fair pink */
404	background: #ffeae6 url('https://api.haiku-os.org/images/alert_stop_32.png') 15px 15px no-repeat;
405	border-color: red;
406}
407
408dl.note dt, dl.remark dt, dl.warning dt, dl.attention dt {
409	display: none; /* don't display the Note: or Warning: header */
410}
411
412dl.note dd, dl.remark dd, dl.warning dd, dl.attention dd {
413	margin: 10px 10px 10px 60px;
414	color: black; /* pseudo-bold */
415}
416
417
418/* For keyboard shortcuts and the like (also from userguide) */
419
420div.contents span.keycap {
421	-webkit-border-radius: 3px;
422	-khtml-border-radius: 3px;
423	-moz-border-radius: 3px;
424	border-radius: 3px;
425	border-color: #c7c7c7; /* silver */
426	border-style: solid;
427	border-width: 1px;
428	padding: 0px 2px 0px 2px;
429	background-color: #e8e8e8; /* mercury */
430	font-family: serif;
431	font-variant: small-caps;
432}
433
434
435/* Continue with the rest of the standard Doxygen stuff... */
436
437CAPTION { font-weight: bold }
438div.qindex {
439	width: 100%;
440	background-color: #f3f3f3; /* concrete */
441	border: 1px solid #c0c0c0; /* silver */
442	text-align: center;
443	margin: 2px;
444	padding: 2px;
445	line-height: 1.3;
446}
447div.nav {
448	width: 100%;
449	background-color: #f3f3f3; /* concrete */
450	border: 1px solid #c0c0c0; /* silver */
451	text-align: center;
452	margin: 2px;
453	padding: 2px;
454	line-height: 1.3;
455}
456div.navtab {
457	background-color: #f3f3f3; /* concrete */
458	border: 1px solid #c0c0c0; /* silver */
459	text-align: center;
460	margin: 2px;
461	margin-right: 15px;
462	padding: 2px;
463}
464TD.navtab {
465	;
466}
467A.qindex {
468	text-decoration: none;
469	font-weight: bold;
470	color: #1a419d; /* fun blue */
471}
472A.qindex:visited {
473	text-decoration: none;
474	font-weight: bold;
475	color: #1a419d; /* fun blue */
476}
477A.qindex:hover {
478	text-decoration: none;
479	background-color: #ddddff; /* fog */
480}
481A.qindexHL {
482	text-decoration: none;
483	font-weight: bold;
484	background-color: #6666cc; /* blue marguerite */
485	color: white;
486	border: 1px double #9295c2; /* bell blue */
487}
488A.qindexHL:hover {
489	text-decoration: none;
490	background-color: #6666cc; /* blue marguerite */
491	color: white;
492}
493A.qindexHL:visited {
494	text-decoration: none;
495	background-color: #6666cc; /* blue marguerite */
496	color: white;
497}
498A.elRef {
499	font-weight: bold
500}
501A.code:link {
502	text-decoration: none;
503	font-weight: normal;
504	color: blue;
505}
506A.code:visited {
507	text-decoration: none;
508	font-weight: normal;
509	color: blue;
510}
511A.codeRef:link {
512	font-weight: normal;
513	color: blue;
514}
515A.codeRef:visited {
516	font-weight: normal;
517	color: blue;
518}
519dl.el {
520	margin-left: -1cm
521}
522div.fragment {
523	width: 99%;
524	background-color: #f3f3f3; /* concrete */
525	border: 1px solid #c0c0c0; /* silver */
526	padding: 4px;
527}
528div.fragment pre.fragment {
529	color: black;
530	font-family: "Deja Vu Mono", Courier, "Courier New", monospace, fixed;
531	font-weight: normal;
532	font-style: normal;
533	font-size: 13px;
534	line-height: 1.3;
535}
536div.fragment pre.fragment a.code {
537	font-weight: bold;
538}
539div.ah {
540	background-color: black;
541	font-weight: bold;
542	color: white;
543	margin-bottom: 3px;
544	margin-top: 3px;
545}
546TD.indexkey {
547	background-color: #f3f3f3; /* concrete */
548	border: 1px solid #c0c0c0; /* silver */
549	font-weight: bold;
550	padding-right  : 10px;
551	padding-top    : 2px;
552	padding-left   : 10px;
553	padding-bottom : 2px;
554	margin-left    : 0px;
555	margin-right   : 0px;
556	margin-top     : 2px;
557	margin-bottom  : 2px;
558}
559TD.indexvalue {
560	background-color: #f3f3f3; /* concrete */
561	border: 1px solid #c0c0c0; /* silver */
562	font-style: italic;
563	padding-right  : 10px;
564	padding-top    : 2px;
565	padding-left   : 10px;
566	padding-bottom : 2px;
567	margin-left    : 0px;
568	margin-right   : 0px;
569	margin-top     : 2px;
570	margin-bottom  : 2px;
571}
572TR.memlist {
573   background-color: #f0f0f0; /* gallery */
574}
575P.formulaDsp { text-align: center; }
576IMG.formulaDsp { }
577IMG.formulaInl { vertical-align: middle; }
578SPAN.keyword       { color: #008000; /* japanese laurel */ }
579SPAN.keywordtype   { color: #5c5f05; /* antique bronze */ }
580SPAN.keywordflow   { color: #e08000; /* mango tango */ }
581SPAN.comment       { color: #008000; /* japanese laurel */ }
582SPAN.preprocessor  { color: #806020; /* kumera */ }
583SPAN.stringliteral { color: blue; }
584SPAN.charliteral   { color: #008080; /* teal */ }
585.search {
586	color: #003399; /* smalt */
587	font-weight: bold;
588}
589FORM.search {
590	margin-bottom: 0px;
591	margin-top: 0px;
592}
593INPUT.search {
594	color: #000080; /* navy blue */
595	font-weight: normal;
596	background-color: #f3f3f3; /* concrete */
597}
598TD.tiny { font-size: 75%; }
599.dirtab {
600	padding: 4px;
601	border-collapse: collapse;
602	border: 1px solid #84b0c7; /* glacier */
603}
604TH.dirtab {
605	background-color: #f3f3f3; /* concrete */
606	font-weight: bold;
607}
608
609/* member declaration table */
610
611table.memberdecls {
612	width: 100%;
613}
614
615table.memberdecls td.memItemLeft {
616	font-size: 13px;
617	white-space: nowrap;
618	text-align: right;
619	padding: 6px 0px 4px 8px;
620	margin: 4px;
621	vertical-align: top;
622	border-top: 1px solid #c0c0c0; /* silver */
623	border-left: 1px solid #c0c0c0; /* silver */
624	background-color: #f3f3f3; /* concrete */
625}
626
627table.memberdecls td.memItemRight {
628	font-size: 13px;
629	padding: 6px 8px 4px 0px;
630	margin: 4px;
631	vertical-align: top;
632	border-top: 1px solid #c0c0c0; /* silver */
633	border-right: 1px solid #c0c0c0; /* silver */
634	background-color: #f3f3f3; /* concrete */
635}
636
637table.memberdecls td.mdescLeft {
638	font-size: 13px;
639	line-height: 1.3;
640	padding: 1px 0px 4px 8px;
641	margin: 0px;
642	border-bottom: 1px solid #c0c0c0; /* silver */
643	border-left: 1px solid #c0c0c0; /* silver */
644	background-color: #f3f3f3; /* concrete */
645}
646
647table.memberdecls td.mdescRight {
648	font-size: 13px;
649	line-height: 1.3;
650	padding: 1px 8px 4px 0px;
651	margin: 0px;
652	border-bottom: 1px solid #c0c0c0; /* silver */
653	border-right: 1px solid #c0c0c0; /* silver */
654	background-color: #f3f3f3; /* concrete */
655}
656
657table.memberdecls td.mdescRight p {
658	margin: 0;
659	padding: 0;
660}
661
662table.memberdecls td.memTemplItemLeft {
663	font-size: 13px;
664	padding: 1px 0px 0px 8px;
665	margin: 0px;
666	text-align: right;
667	border-left: 1px solid #c0c0c0; /* silver */
668	background-color: #f3f3f3; /* concrete */
669}
670
671table.memberdecls td.memTemplItemRight {
672	font-size: 13px;
673	padding: 1px 8px 0px 0px;
674	margin: 0px;
675	border-right: 1px solid #c0c0c0; /* silver */
676	background-color: #f3f3f3; /* concrete */
677}
678
679table.memberdecls td.memTemplParams {
680	font-size: 13px;
681	padding: 1px 0px 0px 8px;
682	margin: 0px;
683	border-top: 1px solid #c0c0c0; /* silver */
684	border-left: 1px solid #c0c0c0; /* silver */
685	border-right: 1px solid #c0c0c0; /* silver */
686	background-color: #f3f3f3; /* concrete */
687}
688
689table.memberdecls td div.groupHeader {
690	/* same as h3 */
691	color: #0c3762; /* madison */
692	margin-top: 0.5em;
693	margin-bottom: 0.5em;
694	font-size: 1.2em;
695	font-weight: normal;
696	border-bottom: dotted thin #c0c0c0; /* silver */
697}
698
699table.memberdecls td div.groupText {
700	font-size: 14.4px;
701}
702
703/* Style for detailed member documentation */
704
705div.memtemplate {
706	font-weight: normal;
707	font-style: normal;
708}
709
710div.memnav {
711	background-color: #f3f3f3; /* concrete */
712	border: 1px solid #c0c0c0; /* silver */
713	text-align: center;
714	margin: 2px;
715	margin-right: 15px;
716	padding: 2px;
717}
718
719/* member item */
720
721div.memitem {
722	margin-bottom: 20px;
723	width: 100%;
724}
725
726div.memitem dl.info, div.memitem dl.note, div.memitem dl.attention,
727	div.memitem dl.warning,
728	div.memitem dl.stop, div.memitem dl.bug {
729	width: 99%;
730}
731
732/* member prototype */
733
734div.memproto {
735	padding: 4px;
736	background-color: #f3f3f3; /* concrete */
737	border: 1px solid #c0c0c0; /* silver */
738}
739
740div.memproto table {
741	font-size: 14.4px;
742}
743
744/* member table */
745
746div.memproto table.memname {
747	line-height: 1.3;
748}
749
750div.memproto table.memname td.paramtype {
751	white-space: nowrap;
752}
753
754div.memproto table.memname td.paramkey {
755	text-align: right;
756}
757
758div.memproto table.memname td.paramname {
759	white-space: nowrap;
760}
761
762div.memproto table.memname td.memname {
763	white-space: nowrap;
764}
765
766/* member documetation */
767
768div.memdoc {
769	width: 100%;
770}
771
772div.memdoc div.memproto {
773	margin-top: 2em;
774}
775
776div.memdoc table {
777	width: 100%;
778}
779
780div.memdoc table td {
781	vertical-align: middle;
782	padding: 8px;
783	border: 1px solid #d5d5d5; /* silver */
784}
785
786div.memdoc td:first-child {
787	width: 157px;
788}
789
790div.memdoc dl dd table {
791	width: 100%;
792}
793
794div.memdoc dl dd table td {
795	font-size: 14.4px;
796	padding: 8px;
797	border: 1px solid #d5d5d5; /* silver */
798}
799
800div.memdoc dl dd table td ul, table td ol {
801	margin-top: 8px;
802	margin-bottom: 8px;
803}
804
805div.memdoc dl dd div.memdoc table.doxtable td {
806    border: none;
807}
808
809/* parameters table */
810
811div.memdoc dl dd table.params td.paramdir {
812	vertical-align: top;
813	color: black;
814	width: 157px;
815}
816
817div.memdoc dl dd table.params td.paramname {
818	vertical-align: top;
819	font-weight: normal;
820	font-style: normal;
821	color: #dc3c01; /* grenadier */
822	width: 157px;
823}
824
825/* return values table */
826
827div.memdoc dl dd table.retval td.paramname {
828	vertical-align: top;
829	color: blue;
830	width: 157px;
831}
832
833/* End Styling for detailed member documentation */
834
835/* for the tree view */
836.ftvtree {
837	font-family: sans-serif;
838	margin: 0.5em;
839}
840
841.directory { font-size: 9pt; font-weight: bold; }
842.directory h3 { margin: 0px; margin-top: 1em; font-size: 11pt; }
843.directory > h3 { margin-top: 0; }
844.directory p { margin: 0px; white-space: nowrap; }
845.directory div { display: none; margin: 0px; }
846.directory img { vertical-align: -30%; }
847
848/* printer only pretty stuff */
849@media print {
850	/* suggest page orientation */
851	@page { size: portrait; }
852	.noprint {
853		display: none;
854	}
855
856	html {
857		background: #FFF;
858	}
859
860	/* hide header and nav bar */
861	#banner {
862		display:none;
863	}
864
865	div.tabs, div.tabs2, div.tabs3 {
866		display:none;
867	}
868
869	div.summary {
870		margin: 0px;
871		padding: 0px;
872	}
873
874	div.headertitle {
875		margin: 0px;
876		padding: 0px;
877	}
878
879	div.content {
880		margin: 0px;
881		padding: 0px;
882	}
883
884	/* some links we want to print the url along with (CSS2) */
885	a.printurl:after {
886		content: " <" attr(href) ">";
887		font-weight: normal;
888		font-size: small;
889	}
890
891	/* override for those we really don't want to print */
892	a.noprinturl:after {
893		content: "";
894	}
895
896	/* for acronyms we want their definitions inlined at print time */
897	acronym[title]:after {
898		font-size: small;
899		content: " (" attr(title) ")";
900		font-style: italic;
901	}
902
903	/* and not have mozilla dotted underline */
904	acronym {
905		border: none;
906	}
907
908	pre.terminal { /* Terminal output black on white */
909		background-color: #ffffff;
910		color: #000000;
911	}
912}
913