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;
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;
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 color: inherit;
297 margin-bottom: 0;
298}
299
300div.book .note > :first-child,
301div.book .tip > :first-child,
302div.book .warning > :first-child,
303div.book .caution > :first-child,
304div.book .important > :first-child,
305div.appendix .note > :first-child,
306div.appendix .tip > :first-child,
307div.appendix .warning > :first-child,
308div.appendix .caution > :first-child,
309div.appendix .important > :first-child {
310 margin-top: 0;
311}
312
313div.book .note > :last-child,
314div.book .tip > :last-child,
315div.book .warning > :last-child,
316div.book .caution > :last-child,
317div.book .important > :last-child,
318div.appendix .note > :last-child,
319div.appendix .tip > :last-child,
320div.appendix .warning > :last-child,
321div.appendix .caution > :last-child,
322div.appendix .important > :last-child {
323 margin-bottom: 0;
324}
325
326div.book .note,
327div.book .tip,
328div.appendix .note,
329div.appendix .tip {
330 color: var(--note-text-color);
331 background: var(--note-background);
332}
333
334div.book .warning,
335div.book .caution,
336div.appendix .warning,
337div.appendix .caution {
338 color: var(--warning-text-color);
339 background-color: var(--warning-background);
340}
341
342div.book .section,
343div.appendix .section {
344 margin-top: 2em;
345}
346
347div.book div.example,
348div.appendix div.example {
349 margin-top: 1.5em;
350}
351
352div.book div.example details,
353div.appendix div.example details {
354 padding: 5px;
355}
356
357div.book div.example details[open],
358div.appendix div.example details[open] {
359 border: 1px solid #aaa;
360 border-radius: 4px;
361}
362
363div.book div.example details > summary,
364div.appendix div.example details > summary {
365 cursor: pointer;
366}
367
368div.book br.example-break,
369div.appendix br.example-break {
370 display: none;
371}
372
373div.book div.footnotes > hr,
374div.appendix div.footnotes > hr {
375 border-color: #d8d8d8;
376}
377
378div.book div.footnotes > br,
379div.appendix div.footnotes > br {
380 display: none;
381}
382
383div.book dt,
384div.appendix dt {
385 margin-top: 1em;
386}
387
388div.book .toc dt,
389div.appendix .toc dt {
390 margin-top: 0;
391}
392
393div.book .list-of-examples dt,
394div.appendix .list-of-examples dt {
395 margin-top: 0;
396}
397
398div.book code,
399div.appendix code {
400 padding: 0;
401 border: 0;
402 background-color: inherit;
403 color: inherit;
404 font-size: 100%;
405 -webkit-hyphens: none;
406 -moz-hyphens: none;
407 hyphens: none;
408}
409
410div.book div.toc,
411div.appendix div.toc {
412 margin-bottom: 3em;
413 border-bottom: 0.0625rem solid #d8d8d8;
414}
415
416div.book div.toc dd,
417div.appendix div.toc dd {
418 margin-left: 2em;
419}
420
421div.book span.command,
422div.appendix span.command {
423 font-family: monospace;
424 -webkit-hyphens: none;
425 -moz-hyphens: none;
426 hyphens: none;
427}
428
429div.book .informaltable th,
430div.book .informaltable td,
431div.appendix .informaltable th,
432div.appendix .informaltable td {
433 padding: 0.5rem;
434}
435
436div.book .variablelist .term,
437div.appendix .variablelist .term {
438 font-weight: 500;
439}
440
441/*
442 This relies on highlight.js applying certain classes on the prompts.
443 For more details, see https://highlightjs.readthedocs.io/en/latest/css-classes-reference.html#stylable-scopes
444*/
445.hljs-meta.prompt_ {
446 user-select: none;
447 -webkit-user-select: none;
448}
449
450:root {
451 --background: #fff;
452 --main-text-color: #000;
453 --link-color: #405d99;
454 --heading-color: #6586c8;
455 --small-heading-color: #6a6a6a;
456 --note-text-color: #5277c3;
457 --note-background: #f2f8fd;
458 --warning-text-color: #cc3900;
459 --warning-background: #fff5e1;
460 --codeblock-background: #f2f8fd;
461 --codeblock-text-color: #000;
462}
463
464@media (prefers-color-scheme: dark) {
465 :root {
466 --background: #242424;
467 --main-text-color: #fff;
468 --link-color: #6586c8;
469 --small-heading-color: #fff;
470 --note-background: none;
471 --warning-background: none;
472 --codeblock-background: #393939;
473 --codeblock-text-color: #fff;
474 }
475
476 div.book .note,
477 div.book .tip,
478 div.appendix .note,
479 div.appendix .tip,
480 div.book .warning,
481 div.book .caution,
482 div.appendix .warning,
483 div.appendix .caution {
484 border: 2px solid;
485 font-weight: 400;
486 }
487}
488
489@font-face {
490 font-family: Roboto;
491 src: url(Roboto.ttf);
492}