slides(tappaas): photograph slide, and publish deck images
All checks were successful
Build docs site / build (push) Successful in 44s
Build slides / build (push) Successful in 1m4s

Adds a slide after the hardware diagram showing the two racks side by side —
the MakerFLOSS rack at Orange Makerspace and the one at home — to make the
point that the module contract is what lets those two rooms run the same
system.

build-slides.sh now copies image files from slides/ into the output tree at
the same relative path. Marp keeps relative image URLs, so without this the
images would 404 on the published site. Guarded against the local build,
where OUTPUT_DIR is the source directory and the copy would be a no-op onto
itself. This is the first deck in the repo with images; the convention is
documented in docs/services/slides.md.

Photos resampled to 1200px on the long edge (~300 KB each) from the 3072x4080
originals.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Lars Rossen 2026-08-25 18:42:11 +02:00
parent 66b20ffc06
commit 87650dac86
5 changed files with 56 additions and 0 deletions

View file

@ -133,6 +133,25 @@ else
echo "Warning: python3 not found — skipping post-processing"
fi
# Copy deck assets (images) that live next to a source under slides/. Marp keeps
# relative image URLs in the HTML, so the files must exist at the same relative
# path in the output tree. Only slides/ can carry these: docs/presentations/
# decks are flattened to <name>.html, so a relative path would not survive.
# When OUTPUT_DIR is the in-repo slides/ dir, source and target are the same
# file and there is nothing to copy.
if [ -d "$REPO_ROOT/slides" ]; then
while IFS= read -r -d '' asset; do
rel="${asset#"$REPO_ROOT"/slides/}"
dest="$OUTPUT_DIR/$rel"
[ "$asset" -ef "$dest" ] && continue
mkdir -p "$(dirname "$dest")"
cp "$asset" "$dest"
echo " Copied asset $rel"
done < <(find "$REPO_ROOT/slides" -type f \
\( -iname "*.jpg" -o -iname "*.jpeg" -o -iname "*.png" \
-o -iname "*.gif" -o -iname "*.svg" -o -iname "*.webp" \) -print0)
fi
# Regenerate index.html listing every built deck.
INDEX="$OUTPUT_DIR/index.html"
{

View file

@ -26,3 +26,9 @@ Use `slides/` when a deck belongs to a named series and the URL should read like
example `slides/tappaas/how-to/new-module/index.md` is served at
`https://slides.makerfloss.eu/tappaas/how-to/new-module/`. Only the markdown is committed; the
generated HTML under `slides/` is git-ignored.
**Images** belong next to the deck source (`slides/<path>/<name>.jpg`) and are referenced with a
plain relative path. Marp keeps relative URLs as-is, so `build-slides.sh` copies image files from
`slides/` into the output tree at the same relative path — unlike the HTML, these *are* committed.
Only path-mirrored `slides/` decks can carry images; `docs/presentations/` decks are flattened to
`<name>.html`, so a relative path would not survive.

Binary file not shown.

After

Width:  |  Height:  |  Size: 298 KiB

View file

@ -23,6 +23,11 @@ div.mermaid svg { width: 100% !important; height: auto !important; max-height: 4
section.diagram h2 { margin-bottom: 0.1em; }
/* Hand-drawn diagrams (inline SVG) get the same full-width treatment. */
section.diagram > svg { display: block; width: 100%; height: auto; max-height: 520px; margin: 0 auto; }
/* Two photographs side by side, with captions under each. */
section.photos .two-up { display: flex; gap: 1.2em; justify-content: center; align-items: flex-start; }
section.photos figure { margin: 0; flex: 1 1 0; text-align: center; }
section.photos figure img { width: 100%; max-height: 430px; object-fit: contain; border-radius: 6px; }
section.photos figcaption { font-size: 0.72em; opacity: 0.85; margin-top: 0.35em; }
/* Section dividers: gaia's `lead` does the centring; this only sets the scale. */
section.chapter h1 { font-size: 2.6em; margin-bottom: 0.1em; }
/* Punch lines: the slides that are one sentence, said loudly. */
@ -158,6 +163,32 @@ NIC on VLAN 100 straight to the modem, which is how OPNsense gets a WAN.
---
<!-- _class: invert photos -->
## The same platform, two very different rooms
<div class="two-up">
<figure>
<img src="makerfloss-rack.jpg" alt="The MakerFLOSS rack at Orange Makerspace">
<figcaption><strong>makerfloss.eu</strong> — Orange Makerspace. Donated enterprise iron, a community lab.</figcaption>
</figure>
<figure>
<img src="hrossen-rack.jpg" alt="The rack in my basement at home">
<figcaption><strong>hrossen.dk</strong> — my basement. Three small boxes, a switch, a modem.</figcaption>
</figure>
</div>
Same modules. Same `install.sh`. Same tests. Same updates.
<!--
The point of showing both: TAPPaaS does not assume a datacentre OR a
cupboard — the module contract is what makes those two rooms the same system.
The makerspace rack is loud, rented space, many hands; mine is quiet, mine,
and runs my family's calendar. Neither is the "real" deployment.
-->
---
<!-- _class: invert diagram -->
## The software: foundation underneath, stacks on top

Binary file not shown.

After

Width:  |  Height:  |  Size: 310 KiB