pyrox.dev
1html {
2 line-height: 1.15;
3 -webkit-text-size-adjust: 100%;
4}
5
6body {
7 margin: 0;
8}
9
10.book,
11.appendix {
12 margin: auto;
13 width: 100%;
14}
15
16@media screen and (min-width: 768px) {
17 .book,
18 .appendix {
19 max-width: 46rem;
20 }
21}
22
23@media screen and (min-width: 992px) {
24 .book,
25 .appendix {
26 max-width: 60rem;
27 }
28}
29
30@media screen and (min-width: 1200px) {
31 .book,
32 .appendix {
33 max-width: 73rem;
34 }
35}
36
37.book .list-of-examples {
38 display: none;
39}
40
41h1 {
42 font-size: 2em;
43 margin: 0.67em 0;
44}
45
46hr {
47 box-sizing: content-box;
48 height: 0;
49 overflow: visible;
50}
51
52pre {
53 font-family: monospace, monospace;
54 font-size: 1em;
55}
56
57a {
58 background-color: transparent;
59}
60
61strong {
62 font-weight: bolder;
63}
64
65code {
66 font-family: monospace, monospace;
67 font-size: 1em;
68}
69
70sup {
71 font-size: 75%;
72 line-height: 0;
73 position: relative;
74 vertical-align: baseline;
75}
76
77sup {
78 top: -0.5em;
79}
80
81::-webkit-file-upload-button {
82 -webkit-appearance: button;
83 font: inherit;
84}
85
86pre {
87 overflow: auto;
88}
89
90*,
91*::before,
92*::after {
93 box-sizing: border-box;
94}
95
96html {
97 font-size: 100%;
98 line-height: 1.77777778;
99}
100
101@media screen and (min-width: 4000px) {
102 html {
103 background: #000;
104 }
105
106 html body {
107 margin: auto;
108 max-width: 250rem;
109 }
110}
111
112@media screen and (max-width: 320px) {
113 html {
114 font-size: calc(16 / 320 * 100vw);
115 }
116}
117
118body {
119 font-size: 1rem;
120 font-family: "Roboto", sans-serif;
121 font-weight: 300;
122 color: var(--main-text-color);
123 background-color: var(--background);
124 min-height: 100vh;
125 display: flex;
126 flex-direction: column;
127}
128
129@media screen and (max-width: 767.9px) {
130 body {
131 padding-left: 1rem;
132 padding-right: 1rem;
133 }
134}
135
136a {
137 text-decoration: none;
138 border-bottom: 1px solid;
139 color: var(--link-color);
140}
141
142ul {
143 padding: 0;
144 margin-top: 0;
145 margin-right: 0;
146 margin-bottom: 1rem;
147 margin-left: 1rem;
148}
149
150table {
151 border-collapse: collapse;
152 width: 100%;
153 margin-bottom: 1rem;
154}
155
156thead th {
157 text-align: left;
158}
159
160hr {
161 margin-top: 1rem;
162 margin-bottom: 1rem;
163}
164
165h1 {
166 font-weight: 800;
167 line-height: 110%;
168 font-size: 200%;
169 margin-bottom: 1rem;
170 color: var(--heading-color);
171}
172
173h2 {
174 font-weight: 800;
175 line-height: 110%;
176 font-size: 170%;
177 margin-bottom: 0.625rem;
178 color: var(--heading-color);
179}
180
181h2:not(:first-child) {
182 margin-top: 1rem;
183}
184
185h3 {
186 font-weight: 800;
187 line-height: 110%;
188 margin-bottom: 1rem;
189 font-size: 150%;
190 color: var(--heading-color);
191}
192
193.note h3,
194.tip h3,
195.warning h3,
196.caution h3,
197.important h3 {
198 font-size: 120%;
199}
200
201h4 {
202 font-weight: 800;
203 line-height: 110%;
204 margin-bottom: 1rem;
205 font-size: 140%;
206 color: var(--heading-color);
207}
208
209h5 {
210 font-weight: 800;
211 line-height: 110%;
212 margin-bottom: 1rem;
213 font-size: 130%;
214 color: var(--small-heading-color);
215}
216
217h6 {
218 font-weight: 800;
219 line-height: 110%;
220 margin-bottom: 1rem;
221 font-size: 120%;
222}
223
224strong {
225 font-weight: bold;
226}
227
228p {
229 margin-top: 0;
230 margin-bottom: 1rem;
231}
232
233dt > *:first-child,
234dd > *:first-child {
235 margin-top: 0;
236}
237
238dt > *:last-child,
239dd > *:last-child {
240 margin-bottom: 0;
241}
242
243pre,
244code {
245 font-family: monospace;
246}
247
248code {
249 color: #ff8657;
250 background: #f4f4f4;
251 display: inline-block;
252 padding: 0 0.5rem;
253 border: 1px solid #d8d8d8;
254 border-radius: 0.5rem;
255 line-height: 1.57777778;
256}
257
258div.book .programlisting,
259div.appendix .programlisting {
260 border-radius: 0.5rem;
261 padding: 1rem;
262 overflow: auto;
263 background: var(--codeblock-background);
264 color: var(--codeblock-text-color);
265}
266
267div.book .note,
268div.book .tip,
269div.book .warning,
270div.book .caution,
271div.book .important,
272div.appendix .note,
273div.appendix .tip,
274div.appendix .warning,
275div.appendix .caution,
276div.appendix .important {
277 margin-bottom: 1rem;
278 border-radius: 0.5rem;
279 padding: 1.5rem;
280 overflow: auto;
281 background: #f4f4f4;
282}
283
284div.book .note > .title,
285div.book .tip > .title,
286div.book .warning > .title,
287div.book .caution > .title,
288div.book .important > .title,
289div.appendix .note > .title,
290div.appendix .tip > .title,
291div.appendix .warning > .title,
292div.appendix .caution > .title,
293div.appendix .important > .title {
294 font-weight: 800;
295 line-height: 110%;
296 margin-bottom: 1rem;
297 color: inherit;
298 margin-bottom: 0;
299}
300
301div.book .note > :first-child,
302div.book .tip > :first-child,
303div.book .warning > :first-child,
304div.book .caution > :first-child,
305div.book .important > :first-child,
306div.appendix .note > :first-child,
307div.appendix .tip > :first-child,
308div.appendix .warning > :first-child,
309div.appendix .caution > :first-child,
310div.appendix .important > :first-child {
311 margin-top: 0;
312}
313
314div.book .note > :last-child,
315div.book .tip > :last-child,
316div.book .warning > :last-child,
317div.book .caution > :last-child,
318div.book .important > :last-child,
319div.appendix .note > :last-child,
320div.appendix .tip > :last-child,
321div.appendix .warning > :last-child,
322div.appendix .caution > :last-child,
323div.appendix .important > :last-child {
324 margin-bottom: 0;
325}
326
327div.book .note,
328div.book .tip,
329div.appendix .note,
330div.appendix .tip {
331 color: var(--note-text-color);
332 background: var(--note-background);
333}
334
335div.book .warning,
336div.book .caution,
337div.appendix .warning,
338div.appendix .caution {
339 color: var(--warning-text-color);
340 background-color: var(--warning-background);
341}
342
343div.book .section,
344div.appendix .section {
345 margin-top: 2em;
346}
347
348div.book div.example,
349div.appendix div.example {
350 margin-top: 1.5em;
351}
352
353div.book div.example details,
354div.appendix div.example details {
355 padding: 5px;
356}
357
358div.book div.example details[open],
359div.appendix div.example details[open] {
360 border: 1px solid #aaa;
361 border-radius: 4px;
362}
363
364div.book div.example details > summary,
365div.appendix div.example details > summary {
366 cursor: pointer;
367}
368
369div.book br.example-break,
370div.appendix br.example-break {
371 display: none;
372}
373
374div.book div.footnotes > hr,
375div.appendix div.footnotes > hr {
376 border-color: #d8d8d8;
377}
378
379div.book div.footnotes > br,
380div.appendix div.footnotes > br {
381 display: none;
382}
383
384div.book dt,
385div.appendix dt {
386 margin-top: 1em;
387}
388
389div.book .toc dt,
390div.appendix .toc dt {
391 margin-top: 0;
392}
393
394div.book .list-of-examples dt,
395div.appendix .list-of-examples dt {
396 margin-top: 0;
397}
398
399div.book code,
400div.appendix code {
401 padding: 0;
402 border: 0;
403 background-color: inherit;
404 color: inherit;
405 font-size: 100%;
406 -webkit-hyphens: none;
407 -moz-hyphens: none;
408 hyphens: none;
409}
410
411div.book div.toc,
412div.appendix div.toc {
413 margin-bottom: 3em;
414 border-bottom: 0.0625rem solid #d8d8d8;
415}
416
417div.book div.toc dd,
418div.appendix div.toc dd {
419 margin-left: 2em;
420}
421
422div.book span.command,
423div.appendix span.command {
424 font-family: monospace;
425 -webkit-hyphens: none;
426 -moz-hyphens: none;
427 hyphens: none;
428}
429
430div.book .informaltable th,
431div.book .informaltable td,
432div.appendix .informaltable th,
433div.appendix .informaltable td {
434 padding: 0.5rem;
435}
436
437div.book .variablelist .term,
438div.appendix .variablelist .term {
439 font-weight: 500;
440}
441
442/*
443 This relies on highlight.js applying certain classes on the prompts.
444 For more details, see https://highlightjs.readthedocs.io/en/latest/css-classes-reference.html#stylable-scopes
445*/
446.hljs-meta.prompt_ {
447 user-select: none;
448 -webkit-user-select: none;
449}
450
451:root {
452 --background: #fff;
453 --main-text-color: #000;
454 --link-color: #405d99;
455 --heading-color: #6586c8;
456 --small-heading-color: #6a6a6a;
457 --note-text-color: #5277c3;
458 --note-background: #f2f8fd;
459 --warning-text-color: #cc3900;
460 --warning-background: #fff5e1;
461 --codeblock-background: #f2f8fd;
462 --codeblock-text-color: #000;
463}
464
465@media (prefers-color-scheme: dark) {
466 :root {
467 --background: #242424;
468 --main-text-color: #fff;
469 --link-color: #6586c8;
470 --small-heading-color: #fff;
471 --note-background: none;
472 --warning-background: none;
473 --codeblock-background: #393939;
474 --codeblock-text-color: #fff;
475 }
476
477 div.book .note,
478 div.book .tip,
479 div.appendix .note,
480 div.appendix .tip,
481 div.book .warning,
482 div.book .caution,
483 div.appendix .warning,
484 div.appendix .caution {
485 border: 2px solid;
486 font-weight: 400;
487 }
488}
489
490@font-face {
491 font-family: Roboto;
492 src: url(Roboto.ttf);
493}