1/* $OpenBSD: mandoc.css,v 1.42 2025/06/26 16:59:35 schwarze Exp $ */
2/*
3 * Standard style sheet for mandoc(1) -Thtml and man.cgi(8).
4 *
5 * Written by Ingo Schwarze <schwarze@openbsd.org>.
6 * I place this file into the public domain.
7 * Permission to use, copy, modify, and distribute it for any purpose
8 * with or without fee is hereby granted, without any conditions.
9 */
10
11/* Global defaults. */
12
13html { max-width: 65em;
14 --bg: #FFFFFF;
15 --fg: #000000; }
16body { background: var(--bg);
17 color: var(--fg);
18 font-family: Helvetica,Arial,sans-serif; }
19h1, h2 { font-size: 110%; }
20table { margin-top: 0em;
21 margin-bottom: 0em;
22 border-collapse: collapse; }
23/* Some browsers set border-color in a browser style for tbody,
24 * but not for table, resulting in inconsistent border styling. */
25tbody { border-color: inherit; }
26tr { border-color: inherit; }
27td { vertical-align: top;
28 padding-left: 0.2em;
29 padding-right: 0.2em;
30 border-color: inherit; }
31ul, ol, dl { margin-top: 0em;
32 margin-bottom: 0em; }
33li, dt { margin-top: 1em; }
34pre { font-family: inherit; }
35
36.permalink { border-bottom: thin dotted;
37 color: inherit;
38 font: inherit;
39 text-decoration: inherit; }
40* { clear: both }
41
42/* Search form and search results. */
43
44fieldset { border: thin solid silver;
45 border-radius: 1em;
46 text-align: center; }
47input[name=expr] {
48 width: 25%; }
49
50table.results { margin-top: 1em;
51 margin-left: 2em;
52 font-size: smaller; }
53
54/* Header and footer lines. */
55
56div[role=doc-pageheader] {
57 display: flex;
58 border-bottom: 1px dotted #808080;
59 margin-bottom: 1em;
60 font-size: smaller; }
61.head-ltitle { flex: 1; }
62.head-vol { flex: 0 1 auto;
63 text-align: center; }
64.head-rtitle { flex: 1;
65 text-align: right; }
66
67div[role=doc-pagefooter] {
68 display: flex;
69 justify-content: space-between;
70 border-top: 1px dotted #808080;
71 margin-top: 1em;
72 font-size: smaller; }
73.foot-left { flex: 1; }
74.foot-date { flex: 0 1 auto;
75 text-align: center; }
76.foot-right { flex: 1;
77 text-align: right; }
78
79/* Sections and paragraphs. */
80
81main { margin-left: 3.8em; }
82.Nd { }
83section.Sh { }
84h2.Sh { margin-top: 1.2em;
85 margin-bottom: 0.6em;
86 margin-left: -3.2em; }
87section.Ss { }
88h3.Ss { margin-top: 1.2em;
89 margin-bottom: 0.6em;
90 margin-left: -1.2em;
91 font-size: 105%; }
92.Pp { margin: 0.6em 0em; }
93.Sx { }
94.Xr { }
95
96/* Displays and lists. */
97
98.Bd { }
99.Bd-indent { margin-left: 3.8em; }
100
101.Bl-bullet { list-style-type: disc;
102 padding-left: 1em; }
103.Bl-bullet > li { }
104.Bl-dash { list-style-type: none;
105 padding-left: 0em; }
106.Bl-dash > li:before {
107 content: "\2014 "; }
108.Bl-item { list-style-type: none;
109 padding-left: 0em; }
110.Bl-item > li { }
111.Bl-compact > li {
112 margin-top: 0em; }
113
114.Bl-enum { padding-left: 2em; }
115.Bl-enum > li { }
116.Bl-compact > li {
117 margin-top: 0em; }
118
119.Bl-diag { }
120.Bl-diag > dt {
121 font-style: normal;
122 font-weight: bold; }
123.Bl-diag > dd {
124 margin-left: 0em; }
125.Bl-hang { }
126.Bl-hang > dt { }
127.Bl-hang > dd {
128 margin-left: 5.5em; }
129.Bl-inset { }
130.Bl-inset > dt { }
131.Bl-inset > dd {
132 margin-left: 0em; }
133.Bl-ohang { }
134.Bl-ohang > dt { }
135.Bl-ohang > dd {
136 margin-left: 0em; }
137.Bl-tag { margin-top: 0.6em;
138 margin-left: 5.5em; }
139.Bl-tag > dt {
140 float: left;
141 margin-top: 0em;
142 margin-left: -5.5em;
143 padding-right: 0.5em;
144 vertical-align: top; }
145.Bl-tag > dd {
146 clear: right;
147 column-count: 1; /* Force block formatting context. */
148 width: 100%;
149 margin-top: 0em;
150 margin-left: 0em;
151 margin-bottom: 0.6em;
152 vertical-align: top; }
153.Bl-compact { margin-top: 0em; }
154.Bl-compact > dd {
155 margin-bottom: 0em; }
156.Bl-compact > dt {
157 margin-top: 0em; }
158
159.Bl-column { }
160.Bl-column > tbody > tr { }
161.Bl-column > tbody > tr > td {
162 margin-top: 1em; }
163.Bl-compact > tbody > tr > td {
164 margin-top: 0em; }
165
166.Rs { font-style: normal;
167 font-weight: normal; }
168.RsA { }
169.RsB { font-style: italic;
170 font-weight: normal; }
171.RsC { }
172.RsD { }
173.RsI { font-style: italic;
174 font-weight: normal; }
175.RsJ { font-style: italic;
176 font-weight: normal; }
177.RsN { }
178.RsO { }
179.RsP { }
180.RsQ { }
181.RsR { }
182.RsT { font-style: normal;
183 font-weight: normal; }
184.RsU { }
185.RsV { }
186
187.eqn { }
188.tbl td { vertical-align: middle; }
189
190.HP { margin-left: 3.8em;
191 text-indent: -3.8em; }
192
193/* Semantic markup for command line utilities. */
194
195table.Nm { }
196code.Nm { font-style: normal;
197 font-weight: bold;
198 font-family: inherit; }
199.Fl { font-style: normal;
200 font-weight: bold;
201 font-family: inherit; }
202.Cm { font-style: normal;
203 font-weight: bold;
204 font-family: inherit; }
205.Ar { font-style: italic;
206 font-weight: normal; }
207.Op { display: inline flow; }
208.Ic { font-style: normal;
209 font-weight: bold;
210 font-family: inherit; }
211.Ev { font-style: normal;
212 font-weight: normal;
213 font-family: monospace; }
214.Pa { font-style: italic;
215 font-weight: normal; }
216
217/* Semantic markup for function libraries. */
218
219.Lb { }
220code.In { font-style: normal;
221 font-weight: bold;
222 font-family: inherit; }
223a.In { }
224.Fd { font-style: normal;
225 font-weight: bold;
226 font-family: inherit; }
227.Ft { font-style: italic;
228 font-weight: normal; }
229.Fn { font-style: normal;
230 font-weight: bold;
231 font-family: inherit; }
232.Fa { font-style: italic;
233 font-weight: normal; }
234.Vt { font-style: italic;
235 font-weight: normal; }
236.Va { font-style: italic;
237 font-weight: normal; }
238.Dv { font-style: normal;
239 font-weight: normal;
240 font-family: monospace; }
241.Er { font-style: normal;
242 font-weight: normal;
243 font-family: monospace; }
244
245/* Various semantic markup. */
246
247.An { }
248.Lk { }
249.Mt { }
250.Cd { font-style: normal;
251 font-weight: bold;
252 font-family: inherit; }
253.Ad { font-style: italic;
254 font-weight: normal; }
255.Ms { font-style: normal;
256 font-weight: bold; }
257.St { }
258.Ux { }
259
260/* Physical markup. */
261
262.Bf { display: inline flow; }
263.No { font-style: normal;
264 font-weight: normal; }
265.Em { font-style: italic;
266 font-weight: normal; }
267.Sy { font-style: normal;
268 font-weight: bold; }
269.Li { font-style: normal;
270 font-weight: normal;
271 font-family: monospace; }
272
273/* Tooltip support. */
274
275h2.Sh, h3.Ss { position: relative; }
276.An, .Ar, .Cd, .Cm, .Dv, .Em, .Er, .Ev, .Fa, .Fd, .Fl, .Fn, .Ft,
277.Ic, code.In, .Lb, .Lk, .Ms, .Mt, .Nd, code.Nm, .Pa, .Rs,
278.St, .Sx, .Sy, .Va, .Vt, .Xr {
279 display: inline flow;
280 position: relative; }
281
282.An::before { content: "An"; }
283.Ar::before { content: "Ar"; }
284.Cd::before { content: "Cd"; }
285.Cm::before { content: "Cm"; }
286.Dv::before { content: "Dv"; }
287.Em::before { content: "Em"; }
288.Er::before { content: "Er"; }
289.Ev::before { content: "Ev"; }
290.Fa::before { content: "Fa"; }
291.Fd::before { content: "Fd"; }
292.Fl::before { content: "Fl"; }
293.Fn::before { content: "Fn"; }
294.Ft::before { content: "Ft"; }
295.Ic::before { content: "Ic"; }
296code.In::before { content: "In"; }
297.Lb::before { content: "Lb"; }
298.Lk::before { content: "Lk"; }
299.Ms::before { content: "Ms"; }
300.Mt::before { content: "Mt"; }
301.Nd::before { content: "Nd"; }
302code.Nm::before { content: "Nm"; }
303.Pa::before { content: "Pa"; }
304.Rs::before { content: "Rs"; }
305h2.Sh::before { content: "Sh"; }
306h3.Ss::before { content: "Ss"; }
307.St::before { content: "St"; }
308.Sx::before { content: "Sx"; }
309.Sy::before { content: "Sy"; }
310.Va::before { content: "Va"; }
311.Vt::before { content: "Vt"; }
312.Xr::before { content: "Xr"; }
313
314.An::before, .Ar::before, .Cd::before, .Cm::before,
315.Dv::before, .Em::before, .Er::before, .Ev::before,
316.Fa::before, .Fd::before, .Fl::before, .Fn::before, .Ft::before,
317.Ic::before, code.In::before, .Lb::before, .Lk::before,
318.Ms::before, .Mt::before, .Nd::before, code.Nm::before,
319.Pa::before, .Rs::before,
320h2.Sh::before, h3.Ss::before, .St::before, .Sx::before, .Sy::before,
321.Va::before, .Vt::before, .Xr::before {
322 opacity: 0;
323 transition: .15s ease opacity;
324 pointer-events: none;
325 position: absolute;
326 bottom: 100%;
327 box-shadow: 0 0 .35em var(--fg);
328 padding: .15em .25em;
329 white-space: nowrap;
330 font-family: Helvetica,Arial,sans-serif;
331 font-style: normal;
332 font-weight: bold;
333 background: var(--bg);
334 color: var(--fg); }
335.An:hover::before, .Ar:hover::before, .Cd:hover::before, .Cm:hover::before,
336.Dv:hover::before, .Em:hover::before, .Er:hover::before, .Ev:hover::before,
337.Fa:hover::before, .Fd:hover::before, .Fl:hover::before, .Fn:hover::before,
338.Ft:hover::before, .Ic:hover::before, code.In:hover::before,
339.Lb:hover::before, .Lk:hover::before, .Ms:hover::before, .Mt:hover::before,
340.Nd:hover::before, code.Nm:hover::before, .Pa:hover::before,
341.Rs:hover::before, h2.Sh:hover::before, h3.Ss:hover::before, .St:hover::before,
342.Sx:hover::before, .Sy:hover::before, .Va:hover::before, .Vt:hover::before,
343.Xr:hover::before {
344 opacity: 1;
345 pointer-events: inherit; }
346
347/* Overrides to avoid excessive margins on small devices. */
348
349@media (max-width: 37.5em) {
350main { margin-left: 0.5em; }
351h2.Sh, h3.Ss { margin-left: 0em; }
352.Bd-indent { margin-left: 2em; }
353.Bl-hang > dd {
354 margin-left: 2em; }
355.Bl-tag { margin-left: 2em; }
356.Bl-tag > dt {
357 margin-left: -2em; }
358.HP { margin-left: 2em;
359 text-indent: -2em; }
360}
361
362/* Overrides for a dark color scheme for accessibility. */
363
364@media (prefers-color-scheme: dark) {
365html { --bg: #1E1F21;
366 --fg: #EEEFF1; }
367:link { color: #BAD7FF; }
368:visited { color: #F6BAFF; }
369}
