From c17142f09b6f930c8fd2784881cb68b6c187fc1b Mon Sep 17 00:00:00 2001 From: urosm Date: Sun, 30 Jun 2024 18:10:12 +0200 Subject: [PATCH] update `public_html` static files --- public_html/css/print.css | 188 ++++++++++++++++++++++++++++++++++++++ public_html/css/style.css | 99 ++++++++++++-------- 2 files changed, 249 insertions(+), 38 deletions(-) create mode 100644 public_html/css/print.css diff --git a/public_html/css/print.css b/public_html/css/print.css new file mode 100644 index 0000000..68ec7a0 --- /dev/null +++ b/public_html/css/print.css @@ -0,0 +1,188 @@ +/* + * css styling for bavbavhaus.net + * + * A print stylesheet for html generated by `pandoc`. + * + */ + +@page { + size: 210mm 297mm; + margin: 24.75mm 26.25mm 49.50mm; +} + +/* reset */ + +:root { + box-sizing: border-box; + text-size-adjust: none; + -moz-text-size-adjust: none; + -webkit-text-size-adjust: none; +} + +*, +*::before, +*::after { + box-sizing: inherit; + margin: 0; + padding: 0; +} + +/* root, * */ + +:root { + font: 12pt/1.25 serif; +} + +*, +*::before, +*::after { + color: inherit; + font: inherit; +} + +/* blocks */ + +h1, h2, h3, h4, h5, h6 { + text-wrap: balance; + font-weight: bold; +} + +h1 { + font-size: 2rem; + text-align: center; +} + +h2::before { content: "## "; } +h3::before { content: "### "; } +h4::before { content: "#### "; } +h5::before { content: "##### "; } +h6::before { content: "###### "; } + +article :is(h1, h2, h3, h4, h5, h6) { + margin-top: 2rem; +} + +article :is(blockquote, dl, div, figure, hr, menu, ol, p, pre, ul) { + margin-top: 1rem; +} + +article :is(blockquote, div)>:is(blockquote, div, figure, hr, menu, ol, p, pre, ul):first-child { + margin-top: unset; +} + +blockquote, +figcaption { + margin-left: 2rem; + margin-right: 2rem; +} + +dt { + font-style: italic; +} + +figure { + display: grid; + grid-template-rows: round(down, calc(min(160ch, 100vw)/2), 1rlh) auto; +} + +figure img { + place-self: center; +} + +hr { + color: unset; + border: unset; + text-align: center; +} + +hr::after { + content: "***"; +} + +:is(ol, ul, menu, dd, li) :is(blockquote, div, figure, hr, menu, ol, p, pre, ul) { + margin-top: unset; +} + +ol { + padding-left: 2rem; +} + +ul, menu { + padding-left: 2rem; +} + +li p + p { + text-indent: 4ch; +} + +p { + text-align: justify; + hyphens: auto; +} + +pre { + padding-left: 4ch; +} + +img, svg { + max-width: 100%; + max-height: 100%; + display: block; +} + +.math.diplay { + display: block; + text-align: center; +} + +/* inlines */ + +a { + text-decoration: unset; +} + +code { + font-family: monospace; +} + +em { + font-style: italic; +} + +mark { + text-decoration: underline solid inherit 1pt; +} + +strong { + font-weight: bold; +} + +sup, sub { + font-size: unset; + vertical-align: unset; + line-height: 0; +} + +sup::before { + content: "^"; +} + +sub::before { + content: "_"; +} + +u { + text-decoration: underline wavy var(--red) 1pt; +} + +/* layout */ + +main>article#recto { + display: none; +} + +/* div.horizontal */ + +div.horizontal>*:not(:first-child) { + display: none; +} diff --git a/public_html/css/style.css b/public_html/css/style.css index 80f3c6f..2431fa3 100644 --- a/public_html/css/style.css +++ b/public_html/css/style.css @@ -4,7 +4,7 @@ * A dark mono-sized monofont, two-column layout stylesheet with "compact" * markdown formatting of html generated by `pandoc`. * - * / + */ /* variables */ @@ -164,24 +164,28 @@ hr::after { margin-top: unset; } -ol, ul, menu { +ul, menu { padding-left: 1ch; } -ol:has(li:nth-child(10)) { +ol { padding-left: 2ch; } -ol:has(li:nth-child(100)) { +ol:has(li:nth-child(10)) { padding-left: 3ch; } +ol:has(li:nth-child(100)) { + padding-left: 4ch; +} + li::marker { color: var(--md-formatting-color); } ol>li::marker { - content: counter(list-item); + content: counter(list-item) "."; } ul>li::marker { @@ -192,7 +196,6 @@ li p + p { text-indent: 2ch; } - p { hyphens: auto; } @@ -215,6 +218,11 @@ img, svg { display: block; } +.math.diplay { + display: block; + text-align: center; +} + .math.display::before, .math.display::after { content: "$$"; @@ -253,7 +261,6 @@ code { color: var(--blue); } - em { font-style: italic; } @@ -286,7 +293,7 @@ sub::after { } u { - text-decoration: var(--red) wavy underline; + text-decoration: underline wavy var(--red) 1pt; } del, ins { @@ -307,6 +314,10 @@ ins::after { content: "+}"; } color: var(--md-formatting-color); } +.smallcaps { + font-variant: small-caps; +} + /* tables */ @@ -352,7 +363,7 @@ table caption::before { body { width: round(down, min(160ch, 100vw), 2ch); - height: 100vh; + height: round(down, 100vh, 1rlh); margin-left: auto; margin-right: auto; } @@ -381,6 +392,47 @@ main>article#recto>* { overflow-y: scroll; } +/* footnotes */ + +a.footnote-ref sup::before { + content: "[^"; +} + +a.footnote-ref sup::after { + content: "]"; +} + +#footnotes>ol { + list-style-position: inside; + padding-left: unset; +} + +#footnotes>ol>li>*:first-child { + display: inline; +} + +#footnotes>ol>li::marker { + content: "[^" counter(list-item) "]:"; +} + +#footnotes a.footnote-back { + visibility: hidden; + position: relative; + color: var(--blue); +} + +#footnotes a.footnote-back::after { + visibility: visible; + position: absolute; + left: 0; + content: "[<-]"; + text-decoration: underline solid 1pt; +} + +#footnotes a.footnote-back:active { + color: var(--red); +} + /* div.horizontal */ @@ -397,35 +449,6 @@ div.horizontal>* { scroll-snap-align: end; } -/* pandoc specific */ - -.smallcaps { - font-variant: small-caps; -} - -.display.math { - display: block; - text-align: center; -} - -/* footnotes */ - -#footnotes>ol { - list-style-position: inside; - padding-left: unset; -} - -#footnotes>ol>li>*:first-child { - display: inline; -} - -a.footnote-back { - color: var(--blue); -} - -a.footnote-back:active { - color: var(--red); -} /* internal links */