pub / zeitung

commit f249c981a11e10a75585e1af765f7d5478d5b8e1
parent cd09beed131b263ef034c4471abb23c4f903ada1
Author: JayVii <jayvii[AT]posteo[DOT]de>
Date:   Tue,  3 Mar 2026 19:20:57 +0100

feat: add floating menu in HTML and three font sizes to choose

Diffstat:
M
generate.sh
 | 
76
+++++++++++++++++++++++++++++++++-------------------------------------------
A
templates/scale_fonts.html
 | 
41
+++++++++++++++++++++++++++++++++++++++++
M
templates/style.css
 | 
15
+++++++++++++++

3 files changed, 89 insertions(+), 43 deletions(-)
diff --git a/generate.sh b/generate.sh
@@ -1,43 +1,22 @@
 #!/usr/bin/env bash
 
-# run perlanet on the config file to fetch all feeds and populate the markdown
+# run perlanet on the config file to fetch all feeds and populate the markdown -
 mkdir -p ./output/
 perlanet "./perlanetrc.yaml"
 
-# ensure only characters exist, that are valid for the LaTeX template
-sed -E \
-  -e 's/ä/\[ae\]/g' \
-  -e 's/ö/\[oe\]/g' \
-  -e 's/ü/\[ue\]/g' \
-  -e 's/ß/\[ss\]/g' \
-  -e 's/Ä/\[Ae\]/g' \
-  -e 's/Ö/\[Oe\]/g' \
-  -e 's/Ü/\[Ue\]/g' \
-  -i ./output/zeitung.md
-iconv -t ascii -c ./output/zeitung.md | tee ./output/zeitung2.md > /dev/null
-mv ./output/zeitung2.md ./output/zeitung.md
-sed -E \
-  -e 's/\[ae\]/ä/g' \
-  -e 's/\[oe\]/ö/g' \
-  -e 's/\[ue\]/ü/g' \
-  -e 's/\[ss\]/ß/g' \
-  -e 's/\[Ae\]/Ä/g' \
-  -e 's/\[Oe\]/Ö/g' \
-  -e 's/\[Ue\]/Ü/g' \
-  -i ./output/zeitung.md
-iconv -t utf-8 -c ./output/zeitung.md | tee ./output/zeitung2.md > /dev/null
-mv ./output/zeitung2.md ./output/zeitung.md
+# remove all articles before yesterday -----------------------------------------
 
-# remove all articles before yesterday
 ## remove start/stop markers from all recent articles
 sed -E \
   -e "s/^<\!--(START|STOP):$(date +%Y-%m-%d)T[0-9:]+-->$//g" \
   -e "s/^<\!--(START|STOP):$(date +%Y-%m-%d -d 'yesterday')T[0-9:]+-->$//g" \
   -i ./output/zeitung.md
+
 ## remove all articles that still have start/stop markers
-perl -pe 'BEGIN{undef $/;} s/<\!--START.*?<\!--STOP.*?-->//smg' -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<\!--START.*?<\!--STOP.*?-->//smg' \
+  -i ./output/zeitung.md
 
-# clean up HTML
+# clean up HTML ----------------------------------------------------------------
 
 ## remove linebreaks at the start of headline tags
 perl -pe 's/(<h[1-6][^>]*>)(.*)\n+/$1$2/g' -i ./output/zeitung.md
@@ -54,16 +33,24 @@ sed -E \
   -i ./output/zeitung.md
 
 ## replace strong, bold, italic, emphasis tags with markdown syntax
-perl -pe 'BEGIN{undef $/;} s/<strong[^>]*?>(.*?)<\/strong>/__$1__/smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<b[^>]*?>(.*?)<\/b>/__$1__/smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<i[^>]*?>(.*?)<\/i>/_$1_/smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<em[^>]*?>(.*?)<\/em>/_$1_/smg' -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<strong[^>]*?>(.*?)<\/strong>/__$1__/smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<b[^>]*?>(.*?)<\/b>/__$1__/smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<i[^>]*?>(.*?)<\/i>/_$1_/smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<em[^>]*?>(.*?)<\/em>/_$1_/smg' \
+  -i ./output/zeitung.md
 
 ## remove any content that is within specific html tags
-perl -pe 'BEGIN{undef $/;} s/<time[^>]*?>.*?<\/time>//smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<figure[^>]*?>.*?<\/figure>//smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<figcaption[^>]*?>.*?<\/figcaption>//smg' -i ./output/zeitung.md
-perl -pe 'BEGIN{undef $/;} s/<iframe[^>]*?>.*?<\/iframe>//smg' -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<time[^>]*?>.*?<\/time>//smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<figure[^>]*?>.*?<\/figure>//smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<figcaption[^>]*?>.*?<\/figcaption>//smg' \
+  -i ./output/zeitung.md
+perl -pe 'BEGIN{undef $/;} s/<iframe[^>]*?>.*?<\/iframe>//smg' \
+  -i ./output/zeitung.md
 
 ## remove any remaining HTML tags (but leave their content)
 perl -pe 'BEGIN{undef $/;} s/<[^>]+?>//smg' -i ./output/zeitung.md
@@ -71,30 +58,33 @@ perl -pe 'BEGIN{undef $/;} s/<[^>]+?>//smg' -i ./output/zeitung.md
 ## remove lines starting with empty space
 sed -E -e 's/^\s+//g' -i ./output/zeitung.md
 
-# clean up quirks
-## 1. separated first letter at start of article
+# clean up quirks --------------------------------------------------------------
+
+## separated first letter at start of article
 sed -E -e 's/^([A-Z])\s([a-z])/\1\2/g' -i ./output/zeitung.md
-## 2. text is not allowed to contain literal "*", so escape it
+
+## text is not allowed to contain literal "*", so escape it
 sed -E -e 's/\*/\\*/g' -i ./output/zeitung.md
 
-# generate internal linking by creating SHA1 hashes
+# generate internal linking by creating SHA1 hashes ----------------------------
 perl -MDigest::SHA=sha1_hex \
   -pe 's/HASH:(http[^(\)|\})]+)/sha1_hex$1/ge' \
   -i ./output/zeitung.md
 
-# remove double entries
+# remove double entries --------------------------------------------------------
 grep "{#" ./output/zeitung.md | \
 sed -E -e 's/(\-|\;|\\|\/|\ |\!|\"|\#|\$|\&|\(|\)|\||\*|\,|\<|\>|\[|\]|\^|\`|\{|\.)/\\\1/g' | \
 while read -r line; do
   perl -pe "BEGIN{undef $/;} s/$line.*?$line/$line/smg" -i ./output/zeitung.md
 done
 
-# determine system language
+# determine system language ----------------------------------------------------
 lang=$(echo "$LANG" | sed -e 's/\..*$//g' -e 's/_/-/g')
 
-# generate output (html, pdf, epub)
+# generate output (html, pdf, epub) --------------------------------------------
 pandoc ./output/zeitung.md -t html -f markdown -o ./output/zeitung.html \
-  --css=./templates/style.css --self-contained --toc --toc-depth=1 -V lang=$lang
+  --css=./templates/style.css --include-in-header=./templates/scale_fonts.html \
+  --self-contained --toc --toc-depth=1 -V lang=$lang
 pandoc ./output/zeitung.md -t pdf -f markdown -o ./output/zeitung.pdf \
   --pdf-engine=xelatex --template eisvogel -V lang=$lang
 pandoc ./output/zeitung.md -t pdf -f markdown -o ./output/zeitung_mobile.pdf \
diff --git a/templates/scale_fonts.html b/templates/scale_fonts.html
@@ -0,0 +1,41 @@
+<script>
+  function add_menu_entries() {
+
+    // search TOC navigation
+    var nav = document.querySelector("nav#TOC");
+
+    // create buttons
+    var small = create_scale_button("75%", "Small");
+    var medium = create_scale_button("100%", "Medium");
+    var large = create_scale_button("125%", "Large");
+
+    // add buttons to menu
+    nav.querySelector("ul").appendChild(small);
+    nav.querySelector("ul").appendChild(medium);
+    nav.querySelector("ul").appendChild(large);
+  }
+
+  function create_scale_button(size, label) {
+
+    // create list item and companion anchor
+    var list = document.createElement("li");
+    var anchor = document.createElement("a");
+
+    // add function and label
+    anchor.href = "javascript:scale_fonts('" + size +"');";
+    anchor.innerText = label;
+
+    // add anchor to list object
+    list.appendChild(anchor);
+
+    // return object
+    return(list);
+  }
+
+  function scale_fonts(size) {
+    document.querySelector("body").style = "font-size:" + size;
+  }
+
+  // run script on load
+  setTimeout(add_menu_entries, 100);
+</script>
diff --git a/templates/style.css b/templates/style.css
@@ -27,3 +27,18 @@ a {
 p {
   text-align: justify;
 }
+nav {
+  position: sticky;
+  top: 0px;
+  background: var(--bg);
+  padding: 1px;
+  border-radius: 5px;
+  
+}
+nav > ul {
+  text-align: center;
+}
+nav > ul > li {
+  display: inline-block;
+  margin: 5px;
+}