summaryrefslogtreecommitdiffstats
path: root/html/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'html/style.css')
-rw-r--r--html/style.css594
1 files changed, 594 insertions, 0 deletions
diff --git a/html/style.css b/html/style.css
new file mode 100644
index 0000000..bdb6739
--- /dev/null
+++ b/html/style.css
@@ -0,0 +1,594 @@
1/*!
2 * LaTeX.css (https://latex.now.sh/)
3 *
4 * Source: https://github.com/vincentdoerig/latex-css
5 * Licensed under MIT (https://github.com/vincentdoerig/latex-css/blob/master/LICENSE)
6 * Edit-by: Minijackson based on the Nord theme, the default VimWiki theme, and Tufte CSS
7*/
8
9/*
10@font-face {
11 font-family: 'Latin Modern';
12 font-style: normal;
13 font-weight: normal;
14 font-display: swap;
15 src: url('./fonts/LM-regular.woff2') format('woff2'),
16 url('./fonts/LM-regular.woff') format('woff'),
17 url('./fonts/LM-regular.ttf') format('truetype');
18}
19
20@font-face {
21 font-family: 'Latin Modern';
22 font-style: italic;
23 font-weight: normal;
24 font-display: swap;
25 src: url('./fonts/LM-italic.woff2') format('woff2'),
26 url('./fonts/LM-italic.woff') format('woff'),
27 url('./fonts/LM-italic.ttf') format('truetype');
28}
29
30@font-face {
31 font-family: 'Latin Modern';
32 font-style: normal;
33 font-weight: bold;
34 font-display: swap;
35 src: url('./fonts/LM-bold.woff2') format('woff2'),
36 url('./fonts/LM-bold.woff') format('woff'),
37 url('./fonts/LM-bold.ttf') format('truetype');
38}
39
40@font-face {
41 font-family: 'Latin Modern';
42 font-style: italic;
43 font-weight: bold;
44 font-display: swap;
45 src: url('./fonts/LM-bold-italic.woff2') format('woff2'),
46 url('./fonts/LM-bold-italic.woff') format('woff'),
47 url('./fonts/LM-bold-italic.ttf') format('truetype');
48}
49*/
50
51
52@font-face {
53 font-family: "et-book";
54 src: url("fonts/et-book-roman-line-figures/et-book-roman-line-figures.eot");
55 src: url("fonts/et-book-roman-line-figures/et-book-roman-line-figures.eot?#iefix") format("embedded-opentype"), url("fonts/et-book-roman-line-figures/et-book-roman-line-figures.woff") format("woff"), url("fonts/et-book-roman-line-figures/et-book-roman-line-figures.ttf") format("truetype"), url("fonts/et-book-roman-line-figures/et-book-roman-line-figures.svg#etbookromanosf") format("svg");
56 font-weight: normal;
57 font-style: normal
58}
59
60@font-face {
61 font-family: "et-book";
62 src: url("fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.eot");
63 src: url("fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.eot?#iefix") format("embedded-opentype"), url("fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.woff") format("woff"), url("fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.ttf") format("truetype"), url("fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.svg#etbookromanosf") format("svg");
64 font-weight: normal;
65 font-style: italic
66}
67
68@font-face {
69 font-family: "et-book";
70 src: url("fonts/et-book-bold-line-figures/et-book-bold-line-figures.eot");
71 src: url("fonts/et-book-bold-line-figures/et-book-bold-line-figures.eot?#iefix") format("embedded-opentype"), url("fonts/et-book-bold-line-figures/et-book-bold-line-figures.woff") format("woff"), url("fonts/et-book-bold-line-figures/et-book-bold-line-figures.ttf") format("truetype"), url("fonts/et-book-bold-line-figures/et-book-bold-line-figures.svg#etbookromanosf") format("svg");
72 font-weight: bold;
73 font-style: normal
74}
75
76/* Box sizing rules */
77*,
78*::before,
79*::after {
80 box-sizing: border-box;
81}
82
83/* Remove default margin */
84body,
85h1,
86h2,
87h3,
88h4,
89p,
90ul[class],
91ol[class],
92li,
93figure,
94figcaption,
95dl,
96dd {
97 margin: 0;
98}
99
100/* Make default font-size 1rem and add smooth scrolling to anchors */
101html {
102 font-size: 1.4rem;
103 scroll-behavior: smooth;
104}
105
106body {
107 font-family: /*'Latin Modern', Georgia, Cambria, 'Times New Roman', Times,*/ 'et-book', serif;
108 line-height: 1.8;
109
110 max-width: 80ch;
111 min-height: 100vh;
112 overflow-x: hidden;
113 margin: 0 auto;
114 padding: 2rem 1.25rem;
115
116 counter-reset: theorem;
117 counter-reset: definition;
118 counter-reset: sidenote-counter;
119
120 color: #eceff4;
121 background-color: #2e3440;
122
123 text-rendering: optimizeLegibility;
124}
125
126/* Hyphenate all paragraphs */
127p {
128 /*text-align: justify;*/
129 hyphens: auto;
130 -webkit-hyphens: auto;
131 -moz-hyphens: auto;
132 margin-top: 1rem;
133}
134
135/* A elements that don't have a class get default styles */
136a:not([class]) {
137 text-decoration-skip-ink: auto;
138}
139
140a,
141a:visited {
142 color: #8fbcbb;
143}
144
145a:focus {
146 outline-offset: 2px;
147 outline: 2px solid #81a1c1;
148}
149
150/* Make images easier to work with */
151img {
152 max-width: 100%;
153 display: block;
154}
155
156/* Inherit fonts for inputs and buttons */
157input,
158button,
159textarea,
160select {
161 font: inherit;
162}
163
164/* Prevent textarea from overflowing */
165textarea {
166 width: 100%;
167}
168
169/* Natural flow and rhythm in articles by default */
170article > * + * {
171 margin-top: 1em;
172}
173
174/* Styles for inline code or code snippets */
175code,
176pre,
177kbd {
178 font-family: /*Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',*/
179 monospace;
180 font-size: 85%;
181}
182/* inline code */
183:not(pre) > code {
184 background: #434c5e;
185 padding: 3px 6px;
186 border-radius: 3px;
187}
188pre {
189 padding: 1rem 1.4rem;
190 max-width: 100%;
191 overflow: auto;
192 border-radius: 4px;
193 background: #3b4252;
194}
195pre code {
196 font-size: 95%;
197 position: relative;
198}
199kbd {
200 background: #434c5e;
201 border: 1px solid #e5e9f0;
202 border-radius: 2px;
203 padding: 2px 4px;
204 font-size: 75%;
205}
206
207/* Make table 100% width, add borders between rows */
208table {
209 border-collapse: collapse;
210 border-spacing: 0;
211 width: 100%;
212 max-width: 100%;
213}
214th,
215td {
216 text-align: left;
217 padding: 0.5rem;
218}
219td {
220 border-bottom: 1px solid #d8dee9;
221}
222/* thead */ th {
223 border-bottom: 2px solid #e5e9f0;
224}
225tfoot th {
226 border-top: 2px solid #e5e9f0;
227}
228
229/* Center align the title */
230h1:first-child {
231 text-align: center;
232}
233
234/* Nested ordered list for ToC */
235nav ol, nav ul {
236 counter-reset: item;
237 padding-left: 2rem;
238}
239nav li {
240 display: block;
241}
242nav li:before {
243 content: counters(item, '.') ' ';
244 counter-increment: item;
245 padding-right: 0.85rem;
246}
247
248/* Definitions */
249dl {
250 margin-top: 1rem;
251}
252
253dt {
254 font-weight: bold;
255}
256
257dd {
258 margin: 0 0 .8rem 2rem;
259}
260
261/* Theorem */
262.theorem {
263 counter-increment: theorem;
264 display: block;
265 margin: 12px 0;
266 font-style: italic;
267}
268.theorem::before {
269 content: 'Theorem ' counter(theorem) '. ';
270 font-weight: bold;
271 font-style: normal;
272}
273
274/* Lemma */
275.lemma {
276 counter-increment: theorem;
277 display: block;
278 margin: 12px 0;
279 font-style: italic;
280}
281.lemma::before {
282 content: 'Lemma ' counter(theorem) '. ';
283 font-weight: bold;
284 font-style: normal;
285}
286
287/* Proof */
288.proof {
289 display: block;
290 margin: 12px 0;
291 font-style: normal;
292 position: relative;
293}
294.proof::before {
295 content: 'Proof. ' attr(title);
296 font-style: italic;
297}
298.proof:after {
299 content: '◾️';
300 position: absolute;
301 right: -12px;
302 bottom: -2px;
303}
304
305/* Definition */
306.definition {
307 counter-increment: definition;
308 display: block;
309 margin: 12px 0;
310 font-style: normal;
311}
312.definition::before {
313 content: 'Definition ' counter(definition) '. ';
314 font-weight: bold;
315 font-style: normal;
316}
317
318/* Center align author name, use small caps and add vertical spacing */
319.author {
320 margin: 0.85rem 0;
321 font-variant-caps: small-caps;
322 text-align: center;
323}
324
325/* Make footnote text smaller and left align it (looks bad with long URLs) */
326.footnotes p {
327 text-align: left;
328 line-height: 1.5;
329 font-size: 85%;
330 margin-bottom: 0.4rem;
331}
332.footnotes {
333 border-top: 1px solid hsl(0, 0%, 39%);
334}
335
336/* Center title and paragraph */
337.abstract,
338.abstract p {
339 text-align: center;
340}
341.abstract {
342 margin: 2.25rem 0;
343}
344
345/* Format the LaTeX symbol correctly (a higher up, e lower) */
346.latex span:nth-child(1) {
347 text-transform: uppercase;
348 font-size: 0.75em;
349 vertical-align: 0.28em;
350 margin-left: -0.48em;
351 margin-right: -0.15em;
352 line-height: 1ex;
353}
354
355.latex span:nth-child(2) {
356 text-transform: uppercase;
357 vertical-align: -0.5ex;
358 margin-left: -0.1667em;
359 margin-right: -0.125em;
360 line-height: 1ex;
361}
362
363/* Heading typography */
364h1 {
365 font-size: 2.5rem;
366 line-height: 3.25rem;
367 margin-bottom: 1.625rem;
368}
369
370h2 {
371 font-size: 1.7rem;
372 line-height: 2rem;
373 margin-top: 3rem;
374}
375
376h3 {
377 font-size: 1.4rem;
378 margin-top: 2.5rem;
379}
380
381h4 {
382 font-size: 1.2rem;
383 margin-top: 2rem;
384}
385
386h5 {
387 font-size: 1rem;
388 margin-top: 1.8rem;
389}
390
391h6 {
392 font-size: 1rem;
393 font-style: italic;
394 font-weight: normal;
395 margin-top: 2.5rem;
396}
397
398h3,
399h4,
400h5,
401h6 {
402 line-height: 1.625rem;
403}
404
405h1 + h2 {
406 margin-top: 1.625rem;
407}
408
409h2 + h3,
410h3 + h4,
411h4 + h5 {
412 margin-top: 0.8rem;
413}
414
415h5 + h6 {
416 margin-top: -0.8rem;
417}
418
419h2,
420h3,
421h4,
422h5,
423h6 {
424 margin-bottom: 0.8rem;
425}
426
427blockquote {
428 color: #d8dee9;
429 margin: 0;
430 padding-left: 3em;
431 border-left: 0.5em #4c566a solid;
432 margin-top: 1rem;
433}
434
435.todo {
436 font-weight: bold;
437 background-color: #bf616a;
438 font-size: 0.8em;
439 padding: 3px 6px;
440 border-radius: 3px;
441}
442
443.tag {
444 background-color: #5e81ac;
445 font-family: monospace;
446 padding: 3px 6px;
447 border-radius: 3px;
448}
449
450/* classes for items of todo lists */
451
452.rejected {
453 /* list-style: none; */
454 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAACXBIWXMAAADFAAAAxQEdzbqoAAAAB3RJTUUH4QgEFhAtuWgv9wAAAPZQTFRFmpqam5iYnJaWnJeXnpSUn5OTopCQpoqKpouLp4iIqIiIrYCAt3V1vW1tv2xsmZmZmpeXnpKS/x4e/x8f/yAg/yIi/yQk/yUl/yYm/ygo/ykp/yws/zAw/zIy/zMz/zQ0/zU1/zY2/zw8/0BA/0ZG/0pK/1FR/1JS/1NT/1RU/1VV/1ZW/1dX/1pa/15e/19f/2Zm/2lp/21t/25u/3R0/3p6/4CA/4GB/4SE/4iI/46O/4+P/52d/6am/6ur/66u/7Oz/7S0/7e3/87O/9fX/9zc/93d/+Dg/+vr/+3t/+/v//Dw//Ly//X1//f3//n5//z8////gzaKowAAAA90Uk5T/Pz8/Pz8/Pz8/Pz8/f39ppQKWQAAAAFiS0dEEnu8bAAAAACuSURBVAhbPY9ZF4FQFEZPSKbIMmWep4gMGTKLkIv6/3/GPbfF97b3w17rA0kQOPgvAeHW6uJ6+5h7HqLdwowgOzejXRXBdx6UdSru216xuOMBHHNU0clTzeSUA6EhF8V8kqroluMiU6HKcuf4phGPr1o2q9kYZWwNq1qfRRmTaXpqsyjj17KkWCxKBUBgXWueHIyiAIg18gsse4KHkLF5IKIY10WQgv7fOy4ST34BRiopZ8WLNrgAAAAASUVORK5CYII=);
455 background-repeat: no-repeat;
456 background-position: 0 .2em;
457 padding-left: 1.5em;
458}
459.done0 {
460 /* list-style: none; */
461 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAxQAAAMUBHc26qAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAA7SURBVCiR7dMxEgAgCANBI3yVRzF5KxNbW6wsuH7LQ2YKQK1mkswBVERYF5Os3UV3gwd/jF2SkXy66gAZkxS6BniubAAAAABJRU5ErkJggg==);
462 background-repeat: no-repeat;
463 background-position: 0 .2em;
464 padding-left: 1.5em;
465}
466.done1 {
467 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAxQAAAMUBHc26qAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABtSURBVCiR1ZO7DYAwDER9BDmTeZQMFXmUbGYpOjrEryA0wOvO8itOslFrJYAug5BMM4BeSkmjsrv3aVTa8p48Xw1JSkSsWVUFwD05IqS1tmYzk5zzae9jnVVVzGyXb8sALjse+euRkEzu/uirFomVIdDGOLjuAAAAAElFTkSuQmCC);
468 background-repeat: no-repeat;
469 background-position: 0 .15em;
470 padding-left: 1.5em;
471}
472.done2 {
473 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAxQAAAMUBHc26qAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAB1SURBVCiRzdO5DcAgDAVQGxjAYgTvxlDIu1FTIRYAp8qlFISkSH7l5kk+ZIwxKiI2mIyqWoeILYRgZ7GINDOLjnmF3VqklKCUMgTee2DmM661Qs55iI3Zm/1u5h9sm4ig9z4ERHTFzLyd4G4+nFlVrYg8+qoF/c0kdpeMsmcAAAAASUVORK5CYII=);
474 background-repeat: no-repeat;
475 background-position: 0 .15em;
476 padding-left: 1.5em;
477}
478.done3 {
479 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAxQAAAMUBHc26qAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABoSURBVCiR7dOxDcAgDATA/0DtUdiKoZC3YhLkHjkVKF3idJHiztKfvrHZWnOSE8Fx95RJzlprimJVnXktvXeY2S0SEZRSAAAbmxnGGKH2I5T+8VfxPhIReQSuuY3XyYWa3T2p6quvOgGrvSFGlewuUAAAAABJRU5ErkJggg==);
480 background-repeat: no-repeat;
481 background-position: 0 .15em;
482 padding-left: 1.5em;
483}
484.done4 {
485 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAQCAYAAAAbBi9cAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAzgAAAM4BlP6ToAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAIISURBVDiNnZQ9SFtRFMd/773kpTaGJoQk1im4VDpWQcTNODhkFBcVTCNCF0NWyeDiIIiCm82QoIMIUkHUxcFBg1SEQoZszSat6cdTn1qNue92CMbEr9Sey+XC/Z/zu+f8h6ukUil3sVg0+M+4cFxk42/jH2wAqqqKSCSiPQdwcHHAnDHH9s/tN1h8V28ETdP+eU8fT9Nt62ancYdIPvJNtsu87bmjrJlrTDVM4RROJs1JrHPrD4Bar7A6cpc54iKOaTdJXCUI2UMVrQZ0Js7YPN18ECKkYNQcJe/OE/4dZsw7VqNXQMvHy3QZXQypQ6ycrtwDjf8aJ+PNEDSCzLpn7+m2pD8ZKHlKarYhy6XjEoCYGcN95qansQeA3fNdki+SaJZGTMQIOoL3W/Z89rxv+tokubNajlvk/vm+LFpF2XnUKZHI0I+QrI7Dw0OZTqdzUkpsM7mZTyfy5OPGyw1tK7AFSvmB/Ks8w8YwbUYbe6/3QEKv0vugfxWPnMLJun+d/kI/WLdizpNjMbAIKrhMF4OuwadBALqqs+RfInwUvuNi+fBd+wjogfogAFVRmffO02q01mZZ0HHdgXIzdz0QQLPezIQygX6llxNKKgOFARYCC49CqhoHIUTlss/Vx2phlYwjw8j1CAlfAiwQiJpiy7o1VHnsG5FISkoJu7Q/2YmmaV+i0ei7v38L2CBguSi5AAAAAElFTkSuQmCC);
486 background-repeat: no-repeat;
487 background-position: 0 .15em;
488 padding-left: 1.5em;
489}
490
491/* Tufte CSS, the sidenote part */
492
493.sidenote, .marginnote {
494 float: right;
495 clear: right;
496 margin-right: -45ch;
497 width: 35ch;
498 margin-top: 0;
499 margin-bottom: 1rem;
500 font-size: 0.9rem;
501 line-height: 1.3;
502 color: #abb9cf;
503 border-top: 1px solid #4c566a;
504 border-bottom: 1px solid #4c566a;
505 /* no padding bottom to compensate extra <br> by pandoc-sidenote */
506 padding-top: 1em;
507 position: relative;
508}
509
510.sidenote-number {
511 counter-increment: sidenote-counter;
512}
513
514.sidenote-number:after, .sidenote:before {
515 position: relative;
516 vertical-align: baseline;
517}
518
519.sidenote-number:after {
520 content: counter(sidenote-counter);
521 font-size: 0.9rem;
522 top: -0.5rem;
523 left: 0.1rem;
524}
525
526.sidenote:before {
527 content: counter(sidenote-counter) ":";
528 font-size: 0.9rem;
529 position: absolute;
530 left: -2em;
531}
532
533blockquote .sidenote, blockquote .marginnote {
534 margin-right: -82%;
535 min-width: 59%;
536 text-align: left;
537}
538
539.marginnote > code, .sidenote > code {
540 font-size: 1rem;
541}
542
543input.margin-toggle {
544 display: none;
545}
546
547label.sidenote-number {
548 display: inline;
549}
550
551label.margin-toggle:not(.sidenote-number) {
552 display: none;
553}
554
555@media (max-width: 165ch) {
556 body {
557 padding: 2rem 1.25rem;
558 max-width: 80ch;
559 }
560
561 section > p, section > footer, section > table, section > div {
562 width: 100%;
563 }
564
565 label.margin-toggle:not(.sidenote-number) {
566 display: inline;
567 color: #8fbcbb;
568 }
569
570 .sidenote, .marginnote {
571 display: none;
572 }
573
574 .sidenote-number:after {
575 color: #a3be8c;
576 /*text-decoration: underline;*/
577 }
578
579 .margin-toggle:checked + .sidenote,
580 .margin-toggle:checked + .marginnote {
581 display: block;
582 float: left;
583 left: 1rem;
584 clear: both;
585 width: 95%;
586 margin: 1rem 2.5%;
587 vertical-align: baseline;
588 position: relative;
589 }
590
591 label {
592 cursor: pointer;
593 }
594}