From b2da63511e1c8f3f67d6bf7827de2e9d9f481b32 Mon Sep 17 00:00:00 2001 From: Unrud Date: Mon, 8 Aug 2022 07:13:03 +0200 Subject: [PATCH] Update CSS * Print: Remove link color and show link target * Set correct value for `display` not `initial` * Don't reset font-family for select optionn * Remove default stylesheet * Cosmetic changes --- assets/default.css | 123 ++++---------------------- assets/print.css | 12 +++ assets/screen-narrow.css | 8 +- assets/screen-noscript.css | 8 +- assets/screen.css | 45 +++++----- documentation-generator/template.html | 1 + 6 files changed, 58 insertions(+), 139 deletions(-) create mode 100644 assets/print.css diff --git a/assets/default.css b/assets/default.css index d00a037f..d5ad9156 100644 --- a/assets/default.css +++ b/assets/default.css @@ -1,112 +1,23 @@ -/* https://www.w3.org/TR/CSS22/ */ -html, address, -blockquote, -body, dd, div, -dl, dt, fieldset, form, -frame, frameset, -h1, h2, h3, h4, -h5, h6, noframes, -ol, p, ul, center, -dir, hr, menu, pre { display: block; unicode-bidi: embed } -li { display: list-item } -head { display: none } -table { display: table } -tr { display: table-row } -thead { display: table-header-group } -tbody { display: table-row-group } -tfoot { display: table-footer-group } -col { display: table-column } -colgroup { display: table-column-group } -td, th { display: table-cell } -caption { display: table-caption } -th { font-weight: bolder; text-align: center } -caption { text-align: center } -body { margin: 8px } -h1 { font-size: 2em; margin: .67em 0 } -h2 { font-size: 1.5em; margin: .75em 0 } -h3 { font-size: 1.17em; margin: .83em 0 } -h4, p, -blockquote, ul, -fieldset, form, -ol, dl, dir, -menu { margin: 1.12em 0 } -h5 { font-size: .83em; margin: 1.5em 0 } -h6 { font-size: .75em; margin: 1.67em 0 } -h1, h2, h3, h4, -h5, h6, b, -strong { font-weight: bolder } -blockquote { margin-left: 40px; margin-right: 40px } -i, cite, em, -var, address { font-style: italic } -pre, tt, code, -kbd, samp { font-family: monospace } -pre { white-space: pre } -button, textarea, -input, select { display: inline-block } -big { font-size: 1.17em } -small, sub, sup { font-size: .83em } -sub { vertical-align: sub } -sup { vertical-align: super } -table { border-spacing: 2px; } -thead, tbody, -tfoot { vertical-align: middle } -td, th, tr { vertical-align: inherit } -s, strike, del { text-decoration: line-through } -hr { border: 1px inset } -ol, ul, dir, -menu, dd { margin-left: 40px } -ol { list-style-type: decimal } -ol ul, ul ol, -ul ul, ol ol { margin-top: 0; margin-bottom: 0 } -u, ins { text-decoration: underline } -br:before { content: "\A"; white-space: pre-line } -center { text-align: center } -:link, :visited { text-decoration: underline } -:focus { outline: thin dotted invert } - -/* Begin bidirectionality settings (do not change) */ -BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override } -BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override } - -*[DIR="ltr"] { direction: ltr; unicode-bidi: embed } -*[DIR="rtl"] { direction: rtl; unicode-bidi: embed } - -@media print { - h1 { page-break-before: always } - h1, h2, h3, - h4, h5, h6 { page-break-after: avoid } - ul, ol, dl { page-break-before: avoid } +/* Additional header level used by pandoc */ +p.heading { + font-size: .67em; + margin: 2em 0; + font-weight: bolder; } -/* END: https://www.w3.org/TR/CSS22/ */ - -@media not screen { - nav, .headerlink { - display: none; - } - - p.heading { - font-size: .67em; - margin: 2em 0; - font-weight: bolder; - } - - nav { - /* Override changes made by JS to HTMLElement */ - max-height: none !important; - } - - table, tr, td, th, thead { - border: 1px solid black; - border-collapse: collapse; - } -} - @media print { - h1 { - page-break-before: auto; - } - p.heading { page-break-after: avoid; } } + +table, tr, td, th, thead { + border: 1px solid black; + border-collapse: collapse; +} + +@media not screen { + nav { + /* Override changes made by JS to HTMLElement */ + max-height: none !important; + } +} diff --git a/assets/print.css b/assets/print.css new file mode 100644 index 00000000..31f40d4f --- /dev/null +++ b/assets/print.css @@ -0,0 +1,12 @@ +nav, .headerlink { + display: none; +} + +a { + color: inherit; + text-decoration: underline; +} + +a:not([href^="#"])::after { + content: " (" attr(href) ")"; +} diff --git a/assets/screen-narrow.css b/assets/screen-narrow.css index d81db1e0..cc112777 100644 --- a/assets/screen-narrow.css +++ b/assets/screen-narrow.css @@ -14,7 +14,7 @@ header .logoContainer, header .documentBranch select { } header .logoContainer, header ul, main { - max-width: initial; + max-width: none; } nav { @@ -23,9 +23,9 @@ nav { height: 100vh; top: 0; left: 0; - background-color: #E4E9F6; + background: #e4e9f6; z-index: 1; - max-height: initial !important; + max-height: none !important; margin: 0; transform: translate(-100vw); transition: transform ease .2s; @@ -36,7 +36,7 @@ html.nav-opened { } .nav-opened nav { - transform: translate(0); + transform: none; } main, .navContainer { diff --git a/assets/screen-noscript.css b/assets/screen-noscript.css index d24849bb..946c9399 100644 --- a/assets/screen-noscript.css +++ b/assets/screen-noscript.css @@ -3,11 +3,11 @@ header .documentBranch::after, header .documentBranch select, .navButtonContaine } header .documentBranch span { - display: initial; + display: inline; } nav { - position: relative; + position: static; height: auto; /* Override changes made by JS to HTMLElement */ max-height: none !important; @@ -18,8 +18,8 @@ nav .level2.active > a, nav .level3.active > a { border-left-color: transparent; } -nav .level4 { - display: initial; +nav li.level4 { + display: list-item; } nav .level4 > a::after { diff --git a/assets/screen.css b/assets/screen.css index 504ecbae..0749b4b9 100644 --- a/assets/screen.css +++ b/assets/screen.css @@ -1,7 +1,7 @@ html { font-family: sans-serif; line-height: 1.4; - background-color: #E4E9F6; + background: #e4e9f6; color: #424247; } @@ -18,9 +18,6 @@ body > * { a { color: #a40000; -} - -a:link { text-decoration: none; } @@ -31,7 +28,7 @@ a:hover { header { display: flex; flex-direction: column; - background-color: #050a02; + background: #050a02; color: #efdddd; align-items: center; } @@ -92,7 +89,7 @@ header .documentBranch::after { } header .documentBranch select { - display: initial !important; + display: inline-block !important; background: none; color: #efdddd; border: none; @@ -116,13 +113,12 @@ header .documentBranch option { color: initial; font-size: initial; font-weight: initial; - font-family: initial; cursor: initial; } header .linkContainer { order: -1; - background-color: #a40000; + background: #a40000; flex-direction: column; display: flex; align-items: center; @@ -193,7 +189,6 @@ h6 { p.heading { font-size: .75em; margin: 1.67em 0; - font-weight: bolder; } img, .tableContainer { @@ -206,9 +201,9 @@ img, .tableContainer { blockquote { border-radius: 3px; - background-color: #ECE7D5; + background: #ece7d5; padding: 10px; - border-left: 3px solid #F6E39A; + border-left: 3px solid #f6e39a; margin-left: 0; margin-right: 0; } @@ -223,7 +218,7 @@ blockquote > *:last-child { div.sourceCode, :not(div) > pre { border-radius: 3px; - background-color: #D2D7E3; + background: #d2d7e3; padding: 10px; border-left: 3px solid #a40000; overflow: auto; @@ -235,7 +230,7 @@ pre > code { :not(pre) > code { border-radius: 2px; - background-color: #D2D7E3; + background: #d2d7e3; padding: 0 2px; } @@ -275,6 +270,7 @@ nav { nav { scrollbar-width: none; + scrollbar-color: #424247 #d2d7e3; } nav:hover, nav:focus-within { @@ -282,16 +278,16 @@ nav { } nav::-webkit-scrollbar { - display: none; - background-color: #D2D7E3; + width: 0; + background: #d2d7e3; } nav::-webkit-scrollbar-thumb { - background-color: #424247; + background: #424247; } nav:hover::-webkit-scrollbar, nav:focus-within::-webkit-scrollbar { - display: initial; + width: initial; } } @@ -332,7 +328,7 @@ nav .level4 > a { } nav .level2.active > a, nav .level3.active > a { - background: #D2D7E3; + background: #d2d7e3; border-left-color: #a40000; } @@ -340,8 +336,8 @@ nav .level4 { display: none; } -nav .active > ul > .level4 { - display: initial; +nav .active > ul > li.level4 { + display: list-item; } .documentContainer p, .documentContainer ul, .documentContainer ol { @@ -357,12 +353,11 @@ nav .active > ul > .level4 { } table, tr, td, th, thead { - border: 1px solid #424247; - border-collapse: collapse; + border-color: #424247; } thead { - background-color: #D2D7E3; + background: #d2d7e3; } td, th { @@ -373,6 +368,6 @@ td, th { display: none; } -section > *:first-child:hover .headerlink { - display: initial; +section > *:first-child:hover a.headerlink { + display: inline; } diff --git a/documentation-generator/template.html b/documentation-generator/template.html index 9d391add..db838a21 100644 --- a/documentation-generator/template.html +++ b/documentation-generator/template.html @@ -12,6 +12,7 @@ $endif$ +