From 9d9388967e112aa3286a73316ea8834beb6393ae Mon Sep 17 00:00:00 2001 From: Mark Dumay <61946753+markdumay@users.noreply.github.com> Date: Tue, 28 Jul 2026 16:22:18 +0200 Subject: [PATCH 1/2] docs(blocks): add numbered split layout example for approach MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Document the mod-blocks approach component's new opt-in arguments (gethinode/mod-blocks#181): layout: split renders the heading beside a vertically stacked element list instead of the card grid, and numbered: true auto-numbers elements with a digit badge resolved through the site's configured Font Awesome family. Follows the same per-variant subsection pattern used for the articles block's magazine layout example (commit 2e86551): a short prose intro plus a fenced example-bookshop block, placed before the Arguments section. The exampleSite here only mounts mod-docs' layouts (not its content or data), so it never renders content/blocks/*.md and can't exercise this example live; pnpm test (the exampleSite build) and pnpm run lint:markdown both pass, and lint:markdown reports zero new issues introduced by this change (21 pre-existing issues remain in unrelated files: preview.md, testimonials.md, components/ testimonial.md — not gated by CI, which only runs pnpm test). Does not depend on a release: mod-blocks#181 is still open, and this docs change is intentionally left unpushed until it ships. Co-Authored-By: Claude Fable 5 --- content/blocks/approach.md | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/content/blocks/approach.md b/content/blocks/approach.md index 19c0b1c..af305ad 100644 --- a/content/blocks/approach.md +++ b/content/blocks/approach.md @@ -44,6 +44,36 @@ The `approach` block renders a featured image with one or more steps. {{< /example-bookshop >}} +### Numbered split layout + +Set `layout` to `split` to render the heading beside a vertically stacked list of +elements instead of the card grid. Set `numbered` to `true` to auto-number the +elements with a digit badge instead of a per-element icon; the digit resolves +through the site's configured Font Awesome family. + + +{{< example-bookshop lang="bookshop" >}} + +```yml +- _bookshop_name: approach + heading: + preheading: Preheading + title: Heading + content: Approach content. It supports multiple lines. + layout: split + numbered: true + elements: + - title: First Step + content: Content of the first step + - title: Second Step + content: Content of the second step + - title: Third Step + content: Content of the third step +``` + +{{< /example-bookshop >}} + + ## Arguments The content block supports the following arguments: From a01144ce175c6e6c763f8a9e0dc1bce8bb3812c1 Mon Sep 17 00:00:00 2001 From: Mark Dumay <61946753+markdumay@users.noreply.github.com> Date: Tue, 28 Jul 2026 17:41:22 +0200 Subject: [PATCH 2/2] docs(blocks): use explicit element icons in numbered example Update the approach block's numbered split-layout example to give each element an explicit icon (1-circle/2-circle/3-circle, the same set already used in this page's default example) rather than relying on the bare-digit fallback. Follows the mod-blocks fix that makes numbered: true prefer an element's own icon over the auto-digit fallback, and documents why: the digit fallback only shows a glyph when the resolved icon family ships plain digit names (Font Awesome does; Bootstrap Icons does not, hence the explicit icons here). Re-verified via the hinode exampleSite harness (same read-only scaffolding + full-revert discipline as the prior smoke test, this time replacing both mod-docs and mod-blocks to their local unpushed worktrees): the rendered page now shows real bi-1-circle/bi-2-circle/ bi-3-circle glyphs inside the approach-number badges, confirming the docs example works correctly on hinode's own bi-default site. pnpm run lint:markdown clean on this file (21 pre-existing issues remain in unrelated files, unchanged). pnpm build clean. Co-Authored-By: Claude Fable 5 --- content/blocks/approach.md | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/content/blocks/approach.md b/content/blocks/approach.md index af305ad..4a63109 100644 --- a/content/blocks/approach.md +++ b/content/blocks/approach.md @@ -47,9 +47,12 @@ The `approach` block renders a featured image with one or more steps. ### Numbered split layout Set `layout` to `split` to render the heading beside a vertically stacked list of -elements instead of the card grid. Set `numbered` to `true` to auto-number the -elements with a digit badge instead of a per-element icon; the digit resolves -through the site's configured Font Awesome family. +elements instead of the card grid. Set `numbered` to `true` to render each +element's `icon` in a tinted circle badge instead of the plain marker. An +element without an `icon` falls back to an auto-numbered digit glyph, but that +fallback only shows a glyph when the site's default icon family ships plain +digit names (Font Awesome does); families such as Bootstrap Icons need an +explicit per-element icon like `1-circle`, as used below. {{< example-bookshop lang="bookshop" >}} @@ -64,10 +67,13 @@ through the site's configured Font Awesome family. numbered: true elements: - title: First Step + icon: 1-circle content: Content of the first step - title: Second Step + icon: 2-circle content: Content of the second step - title: Third Step + icon: 3-circle content: Content of the third step ```