Add companion posts on generating training videos from a test suite

Two-part series: "A ghost hand and an audience of one" (the story) and
"Your test suite is a video studio" (the technical companion). Adds a
reusable .figure-row CSS class for side-by-side images.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Eric Wagoner
2026-07-18 13:55:36 -04:00
co-authored by Claude Opus 4.8
parent 8684735f6c
commit 92a8311bb2
6 changed files with 419 additions and 0 deletions
+23
View File
@@ -177,6 +177,29 @@ figure {
}
}
// Two (or more) figures side by side, wrapping to a stack on narrow screens.
// Use by wrapping images in a <div class="figure-row"> via the rawhtml shortcode.
.figure-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
gap: 1.5rem;
margin: 2rem 0;
figure {
flex: 1 1 0;
min-width: 220px;
margin: 0;
}
img {
max-height: 70vh;
width: auto;
max-width: 100%;
}
}
// Also style standalone images in posts
.post-content img:not(figure img) {
display: block;