* make unformatted articles depend on their template
* output to ./aescling.cat.family/blog
* create Atom feed
* prevent full rebuilds by preserving all intermediates
* create <article>s instead of <div class="article">s
* make all rule more robust
* change output directory and relevant paths for new URL
* add footer and some styling
* link to home from article view
* fix link styling
* do the box lifted off the background thing
* add limited OpenGraph suppurrt
* use outset berder-style
* title the blog
* tweak styling
--- /dev/null
+OUTDIR=blog.aescling.cat.family
+
+ARTICLES=$(wildcard source/*.djot)
+_UNFORMATTED_ARTICLES=$(ARTICLES:.djot=.unformatted)
+UNFORMATTED_ARTICLES=$(patsubst source/%, temp/%, $(_UNFORMATTED_ARTICLES))
+_FORMATTED_ARTICLES=$(UNFORMATTED_ARTICLES:.unformatted=.xhtml)
+# putting these in $(OUTDIR) will make the links from index.xhtml point to
+# `out/$BASENAME.xhtml`, instead of `$BASENAME.xhtml`; we will move them later
+FORMATTED_ARTICLES=$(patsubst temp/%, %, $(_FORMATTED_ARTICLES))
+
+# don't delete intermediate files when done; otherwise we always full rebuild
+.SECONDARY:
+
+all: $(OUTDIR)/index.xhtml $(OUTDIR)/atom.xml
+ for f in $(FORMATTED_ARTICLES); do \
+ [ -f "$$f" ] || exit 0; \
+ done && mv $(FORMATTED_ARTICLES) $(OUTDIR)
+
+$(OUTDIR)/index.xhtml: temp/index.unformatted_index
+ hxnormalize -x $< >$@
+
+temp/index.unformatted_index: $(FORMATTED_ARTICLES) template/index.xhtml.template
+ sblg -t template/index.xhtml.template -s rdate -o $@ $(FORMATTED_ARTICLES)
+
+%.xhtml: temp/%.unformatted
+ hxnormalize -x $< >$@
+
+temp/%.unformatted: temp/%.fragment template/article.xhtml.template
+ sblg -t template/article.xhtml.template -c -o $@ $<
+
+# the djot file MUST generate content surrounded by
+#
+# ```
+# <div class="article" data-sblg-article="1">
+# ...
+# </div>
+# ```
+#
+# however, fur semantic reasons, we purrefur `<article>` to `<div>`
+#
+# the hxextract(1) invocation is redundant unless the djot source file is
+# pathological, containing content befur or after the div
+temp/%.fragment: source/%.djot
+ { echo '<article data-sblg-article="1">'; \
+ djot $< | hxextract .article - | sed '1d; $$d'; \
+ echo '</article>'; } >$@
+
+$(OUTDIR)/atom.xml: temp/atom.unformatted_atom
+ hxnormalize -x $< >$@
+
+temp/atom.unformatted_atom: $(FORMATTED_ARTICLES) template/atom.xml.template
+ sblg -t template/atom.xml.template -a -o $@ $(FORMATTED_ARTICLES)
+
+clean:
+ rm temp/*
+ rm $(OUTDIR)/*
--- /dev/null
+# cat æscling’s blog sources
+
+this repository contains the sources and GNU Makefile used to build my new blog
+in purrogress
+
+source files are written in [djot] and converted to XML-compliant HTML with
+[djot.js][djot-js]. those (X)HTML files are converted into the suitable XHTML
+for the blog with [sblg], which is all then autofurmatted with
+[hxnormalize][html-xml-utils]
+
+sblg is also used to build an Atom feed
+
+[djot]: https://www.djot.net/
+[djot-js]: https://github.com/jgm/djot.js
+[html-xml-utils]: https://www.w3.org/Tools/HTML-XML-utils/
+[sblg]: https://kristaps.bsd.lv/sblg
--- /dev/null
+<!DOCTYPE html>
+
+<html lang="en-X-catspeak" xml:lang="en-X-catspeak"
+ xmlns="http://www.w3.org/1999/xhtml">
+ <head prefix="og: http://ogp.me/ns#">
+ <meta charset="utf-8" />
+ <meta content="width=device-width, initial-scale=1.0"
+ name="viewport" />
+ <link href="/atom.xml" rel="alternate" />
+ <meta content="${sblg-titletext}: of smoke and æsc"
+ property="og:title" />
+ <title>${sblg-titletext}: of smoke and æsc</title>
+
+ <style>
+html {
+ font-family: serif;
+ font-size: 14pt;
+ line-height: 1.28;
+ color: #F0B2D8;
+ background: #3B3B3B;
+}
+
+body {
+ background: #1F4505;
+ max-width: 72ch;
+ margin: 0 auto;
+ padding: 1rem;
+ margin-top: 2rem;
+ padding: 1rem;
+ filter: drop-shadow(.5rem .5rem 0.064rem #1c1c1c);
+ border: outset 4px #592846;
+}
+
+h1 {
+ font-family: sans-serif;
+ font-size: 18pt;
+}
+
+article,
+footer {
+ border-top: solid 1px #E63CA4;
+}
+
+footer {
+ font-size: 10pt;
+}
+
+article h1 {
+ font-size: 16pt;
+}
+
+a,
+a:visited {
+ color: #31B9DB;
+}
+
+a:active,
+a:hover,
+a:focus {
+ background: #31B9DB;
+ color: #1F4505;
+}
+
+header {
+ font-size: 12pt;
+}
+
+header p,
+time {
+ font-style: italic;
+}
+
+header,
+footer {
+ text-align: center;
+}
+ </style></head>
+
+ <body>
+ <header>
+ <h1><a href="/">of smoke and æsc</a></h1>
+
+ <p>a blog by cat æscling</p>
+ </header>
+
+ <article data-sblg-article="1"></article>
+
+ <footer>
+ <p>licensed under <a
+ href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA
+ 4.0</a></p>
+ </footer>
+ </body>
+</html>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<feed xmlns="http://www.w3.org/2005/Atom">
+<link href="https://aescling.cat.family/blog" />
+<title>cat æscling: blog</title>
+<updated></updated> <id></id> <entry data-sblg-entry="1"
+data-sblg-forall="1"></entry> </feed>
--- /dev/null
+<!DOCTYPE html>
+
+<html lang="en-X-catspeak" xml:lang="en-X-catspeak"
+ xmlns="http://www.w3.org/1999/xhtml">
+ <head prefix="og: http://ogp.me/ns#">
+ <meta charset="utf-8" />
+ <meta content="width=device-width, initial-scale=1.0"
+ name="viewport" />
+ <meta content="/" property="og:url" />
+ <meta content="of smoke and æsc" property="og:title" />
+ <link href="/atom.xml" rel="alternate" />
+ <title>of smoke and æsc: a blog by cat æscling</title>
+
+ <style>
+html {
+ font-family: serif;
+ font-size: 14pt;
+ line-height: 1.28;
+ color: #F0B2D8;
+ background: #3B3B3B;
+}
+
+body {
+ background: #1F4505;
+ max-width: 72ch;
+ margin: 0 auto;
+ padding: 1rem;
+ margin-top: 2rem;
+ padding: 1rem;
+ filter: drop-shadow(.5rem .5rem 0.064rem #1c1c1c);
+ border: outset 4px #592846;
+}
+
+h1 {
+ font-family: sans-serif;
+ font-size: 18pt;
+}
+
+nav,
+footer {
+ border-top: solid 1px #E63CA4;
+}
+
+footer {
+ font-size: 10pt;
+}
+
+a,
+a:visited {
+ color: #31B9DB;
+}
+
+a:active,
+a:hover,
+a:focus {
+ background: #31B9DB;
+ color: #1F4505;
+}
+
+header {
+ font-size: 12pt;
+}
+
+header p {
+ font-style: italic;
+}
+
+header,
+footer {
+ text-align: center;
+}
+ </style></head>
+
+ <body>
+ <header>
+ <h1>of smoke and æsc</h1>
+
+ <p>a blog by cat æscling</p>
+ </header>
+
+ <nav data-sblg-nav="1"></nav>
+
+ <footer>
+ <p>licensed under <a
+ href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA
+ 4.0</a></p>
+ </footer>
+ </body>
+</html>
cat aescling's git repositories / blog.git / commitdiff