xhtmlize: switch back to using xmllint

Switch back to using xmllint, but now extract + replace the CSS to address the escaping.
2024-09-19 20:02:10 +00:00 · 2022-06-01 22:11:40 -07:00 · 2022-06-01 22:11:40 -07:00 · c1f991efff
commit c1f991efff
parent 6a47371a05
7 changed files with 84 additions and 36 deletions
--- a/.build.yml
+++ b/.build.yml
@ -7,7 +7,7 @@ packages:
  - rsync
  - git  # for Hugo's gitInfo
  - bmake
-  - moreutils
+  - libxml2-utils # for xmllint
 sources:
  - https://git.sr.ht/~seirdy/seirdy.one
 secrets:
--- a/layouts/_default/404.html
+++ b/layouts/_default/404.html
@ -2,21 +2,8 @@
 <html xmlns="http://www.w3.org/1999/xhtml" lang="{{- default "" .Site.LanguageCode }}" xml:lang="{{- default "" .Site.LanguageCode }}" prefix="cc: http://creativecommons.org/ns#">
 <head>
 <meta charset="UTF-8" />
-<meta name="disabled-adaptations" content="watch" /><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
-<meta name="robots" content="noindex,nofollow" />
-<title>{{ .Title }}</title>
-{{ if not (in site.BaseURL ".onion") -}}
-{{ $icon_svg := resources.Get "/favicon.svg" | resources.Fingerprint "md5" }}
-{{- printf `<link rel="icon" sizes="any" href="%s" type="image/svg+xml" />` $icon_svg.RelPermalink | safeHTML }}
-{{- end }}
-{{ $icon_192 := resources.Get "/apple-touch-icon.png" | resources.Fingerprint "md5" }}
-{{- printf `<link rel="icon" sizes="192x192" href="%s" type="image/png" />` $icon_192.RelPermalink | safeHTML -}}
-{{ $favicon := resources.Get "/favicon.png" -}}
-{{ $favicon_base64 := $favicon.Content | base64Encode }}
-{{ printf `<link rel="icon" sizes="32x32" href="data:image/png;base64,%s" type="image/png" />` $favicon_base64 | safeHTML }}
-<meta name="color-scheme" content="light dark" />
-<meta name="theme-color" content="#191919" media="(prefers-color-scheme:dark)" />
-<meta name="theme-color" content="#fff" media="(prefers-color-scheme:light)" />
+<meta name="disabled-adaptations" content="watch" />
+<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
 <!-- inline CSS; remember to allow it with a hash in the CSP -->
 {{- $resources := slice -}}
 {{- $resources = $resources | append (resources.Get "/css/main.css") -}}
@ -27,7 +14,17 @@
 {{ $resources = $resources | append (resources.Get "css/print.css" | resources.ExecuteAsTemplate "print.css" .) -}}
 {{- $css := $resources | resources.Concat "css/style.css" | minify -}}
 <style>{{ $css.Content | safeCSS }}</style>
-{{ hugo.Generator }}
+<meta name="robots" content="noindex,nofollow" />
+<title>{{ .Title }}</title>
+{{ if not (in site.BaseURL ".onion") -}}
+{{ $icon_svg := resources.Get "/favicon.svg" | resources.Fingerprint "md5" }}
+{{- printf `<link rel="icon" sizes="any" href="%s" type="image/svg+xml" />` $icon_svg.RelPermalink | safeHTML }}
+{{- end }}
+{{ $icon_192 := resources.Get "/apple-touch-icon.png" | resources.Fingerprint "md5" }}
+{{- printf `<link rel="icon" sizes="192x192" href="%s" type="image/png" />` $icon_192.RelPermalink | safeHTML -}}
+<meta name="color-scheme" content="light dark" />
+<meta name="theme-color" content="#191919" media="(prefers-color-scheme:dark)" />
+<meta name="theme-color" content="#fff" media="(prefers-color-scheme:light)" />
 </head>
 <body>
 <header>
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@ -1,7 +1,18 @@
 <head>
 	<meta charset="UTF-8" />
 	{{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
-	<meta name="disabled-adaptations" content="watch" /><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+	<meta name="disabled-adaptations" content="watch" />
+	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+	<!-- inline CSS; remember to allow it with a hash in the CSP -->
+	{{- $resources := slice -}}
+	{{- $resources = $resources | append (resources.Get "/css/main.css") -}}
+	{{ $dark := .Site.Params.dark | default "auto" -}}
+	{{- if not (eq $dark "off") -}}
+	{{ $resources = $resources | append (resources.Get "css/dark.css" | resources.ExecuteAsTemplate "dark.css" .) -}}
+	{{- end -}}
+	{{ $resources = $resources | append (resources.Get "css/print.css" | resources.ExecuteAsTemplate "print.css" .) -}}
+	{{- $css := $resources | resources.Concat "css/style.css" | minify -}}
+	<style>{{ $css.Content | safeCSS }}</style>
 	{{ if or (eq site.BaseURL site.Params.CanonicalBaseURL) (in site.BaseURL "wgq3bd2kqoybhstp77i3wrzbfnsyd27wt34psaja4grqiezqircorkyd.onion") -}}
 	<meta name="robots" content="index,follow,max-image-preview:large,max-snippet=-1" />
 	{{ end -}}
@ -46,16 +57,6 @@
 	<meta name="format-detection" content="telephone=no" /><!-- Why does apple do this -->
 	<meta name="theme-color" content="#191919" media="(prefers-color-scheme:dark)" />
 	<meta name="theme-color" content="#fff" media="(prefers-color-scheme:light)" />
-	<!-- inline CSS; remember to allow it with a hash in the CSP -->
-	{{- $resources := slice -}}
-	{{- $resources = $resources | append (resources.Get "/css/main.css") -}}
-	{{ $dark := .Site.Params.dark | default "auto" -}}
-	{{- if not (eq $dark "off") -}}
-	{{ $resources = $resources | append (resources.Get "css/dark.css" | resources.ExecuteAsTemplate "dark.css" .) -}}
-	{{- end -}}
-	{{ $resources = $resources | append (resources.Get "css/print.css" | resources.ExecuteAsTemplate "print.css" .) -}}
-	{{- $css := $resources | resources.Concat "css/style.css" | minify -}}
-	<style>{{ $css.Content | safeCSS }}</style>
 	<meta property="og:title" content="{{ .Title }}" />
 	<meta property="og:site_name" content="{{ $.Site.Title }}" />
 	{{- if not (or (ne "page" .Kind) (eq $canonicalRelPermalink "/bookmarks/") (eq $canonicalRelPermalink "/posts/")) }}
--- a/layouts/partials/processed-content.html
+++ b/layouts/partials/processed-content.html
@ -50,4 +50,9 @@
 {{- $endNotesNotFocusable := `<li id="fn:([0-9]*)">` -}}
 {{- $endNotesFocusable := `<li id="fn:${1}" tabindex="-1">` -}}

+
+<!--Since language-figure doesn't seem to work for some reason just use regex to replace it-->
+{{- $extraLanguageFigure := `<code class="language-figure">` -}}
+{{- $replacedLanguageFigure := `<code translate="no" itemprop="text">` -}}
+
 {{- .Content | replaceRE $referencesWithoutHeading $referencesWithHeading | replaceRE $badNoteRef $goodNoteRef | replaceRE $endnotesClosingDiv $endnotesClosingSection | replaceRE $tocHeadingOutside $tocHeadingInside | replaceRE $footnoteBacklinksBad $footnoteBacklinksGood | replaceRE $repeatedFootnoteBacklinksBad $repeatedFootnoteBacklinksGood | replaceRE $endNotesNotFocusable $endNotesFocusable | replaceRE `\&rsquo;` `’` | replaceRE `\&nbsp;` `\&#160;` | replaceRE `\&ldquo;` `“` | replaceRE `\&rdquo;` `”` | replaceRE `\&hellip;` `—` | replaceRE `\&mdash;` `—` | replaceRE `\&shy;` `\&#173;` | replaceRE `&lsquo;` `‘`| safeHTML -}}
--- a/layouts/shortcodes/codefigure.html
+++ b/layouts/shortcodes/codefigure.html
@ -8,5 +8,5 @@
 	just use the beginning for the label and the full thing for the aria description.
 -->
 <figure aria-labelledby="{{ $id }}" itemprop="hasPart" itemscope="" itemtype="https://schema.org/SoftwareSourceCode">
-{{ .Inner | markdownify -}}
+{{ .Inner | .Page.RenderString -}}
 </figure>
--- a/scripts/xhtmlize-single-file.sh
+++ b/scripts/xhtmlize-single-file.sh
@ -0,0 +1,37 @@
+#!/bin/sh
+# copies an .html file to an equivalent .xhtml file, but replaces
+# the meta charset with an XML declaration for compatibility with some
+# XML tooling.
+# Expects polygot XHTML(5) markup.
+# Formats both the .html and .xhtml file.
+# this means that every index.html file has an equivalent index.xhtml file.
+# content negotiation allows an agent to pick html or xhtml.
+
+# use xmllint to do the formatting.
+# xmllint ruins inline CSS so delete the inline CSS and re-insert it.
+# xmllint also adds extra whitespace around <pre><code> which we remove
+# with "sd". I chose sd since it handles newlines well.
+
+set -e -u
+
+export html_file="$1"
+export tmp_file="${html_file}.tmp"
+export xhtml_file=${html_file%*.html}.xhtml
+
+cleanup() {
+	rm -f "$tmp_file"
+}
+trap cleanup EXIT
+
+trap cleanup EXIT
+sed 7d "$html_file" | xmllint --format --encode UTF-8 --noent - -o "$tmp_file"
+head -n7 "$tmp_file" >> "$xhtml_file"
+cat /tmp/css.css >>"$xhtml_file"
+tail -n +8 "$tmp_file" \
+	| sd '<pre>\n\t*<code ' '<pre><code ' \
+	| sd '(?:\n)</code>\n\t*</pre>' '</code></pre>' >>"$xhtml_file"
+tail -n +2 "$xhtml_file" > "$html_file"
+sed -i 5d "$xhtml_file" # busybox sed supports "-i"
+
+# the "sed 5d" deletes the now-redundant meta charset; it's the first
+# thing in the <head>.
--- a/scripts/xhtmlize.sh
+++ b/scripts/xhtmlize.sh
@ -1,11 +1,19 @@
 #!/bin/sh
 # takes an arg for the output dir.
-# copies every .html file to an equivalent .xhtml file, but replaces
-# the meta charset with an XML declaration for compatibility with some
-# XML tooling.
-# this means that every index.html file has an equivalent index.xhtml file.
-# content negotiation allows an agent to pick html or xhtml.
+# Runs xhtmlize-single-file.sh on every single html file in the output dir.

-find "$1" -type f -name '*.html' \
-	-exec sh -c 'echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>" >"${0%*.html}.xhtml" && xmlfmt -i "	" -f "$0" | busybox sed -e :a -e "/./,\$!d;/^\n*\$/{\$d;N;};/\n\$/ba" | sd -f m "\n(?:\t*)?</" "</" | sd -f m "<pre>\n\t*<code" "<pre><code" | sd -f m "\(\n\t*<abbr" "(<abbr" | pee "sed 5d >>\"${0%*.html}.xhtml\"" "sponge \"$0\""' {} \;
+set -e -u
+
+output_dir="$1"
+script_dir="$(dirname "$0")"
+
+printf '\t\t<style>%s</style>\n' "$(htmlq -t style <"$output_dir/index.html")" >tmp.css
+cleanup() {
+	rm -f "tmp.css"
+}
+trap cleanup EXIT
+
+export XMLLINT_INDENT='	'
+find "$output_dir" -type f -name '*.html' \
+	-exec sh "$script_dir/xhtmlize-single-file.sh" {} \;
 # done