The previous section_break implementation used CSS mask-image, which
incidentally established a stacking context on the section. Replacing
it with a gradient overlay div removed that side-effect — and broke
the visual depth on every section with a gradient mesh or radial
background.
Without a stacking context, the section's negative-z-index descendants
(home-section-bg at z:-1 carrying the radial gradient, and the
gradient_mesh wrapper at z:-10 carrying the orbs) escaped the section
and painted behind the page root, where they were occluded by the
page body — flat dark hero, no glow, no orbs.
Add `isolate` (isolation: isolate) to the section element. This is
the no-visual-side-effect way to force a stacking context, restoring
containment of the negative-z layers without affecting siblings or
content.
The mask-image approach for section_break was wrong: making pixels
transparent reveals the body background, not the next sibling section
(which sits below in document flow, not behind in z-order). When the
body bg didn't match the adjacent section, this produced a visible
white/light strip between sections — exactly what the fade was
supposed to prevent.
Replace mask-image with absolutely-positioned gradient overlay divs at
the section's top/bottom edges. The overlay fades from transparent to
a user-specified colour matching the adjacent sibling's background.
Explicit colour declaration is required because Hugo can't reliably
auto-detect the next sibling's bg at parse time.
API change (no backward-compat — feature was added this session, no
sites depend on the legacy string form):
# before
section_break: fade-bottom
# after
section_break:
fade_bottom: "#101828" # CSS colour matching next section's bg
fade_top: "#0a0e27" # optional, independent
size: "6rem" # optional, default 6rem
Update the landing page hero (fade-bottom into dark logos band) and
cta-card (fade-top from white FAQ section above) to the new form.
Switch the logos section to a dark band (bg-gray-900 + force `dark`
mode within the section) and white logo style. Extends the dark zone
from the hero so the hero's section_break: fade-bottom transitions
dark → dark instead of revealing a light strip.
The logos block itself keeps supporting both light and dark — only the
landing page config changes here. Other templates can opt for a light
band by reverting to `bg-gray-50 dark:bg-gray-900` + `logo_style:
grayscale`.
The featured card's quote was centered (inheriting `text-center` from
the section wrapper) while the avatar+name+role row read as left-
aligned because the flex container starts at the card's left edge —
the two halves of the same card disagreed. Multi-card grid was already
left-aligned, so single-vs-grid was inconsistent too.
Move `text-center` from the outer wrapper onto the section header
(title/text) only. The featured card and grid cards now both render
left-aligned, the decorative `"` mark sits naturally as a leading
glyph for the quote, and the awkward forced line breaks from
text-center go away.
- New `content.media` field accepts image (Hugo-pipeline-processed for
responsive srcset) or video (passes through as <video>). Optional
`dark_src` provides a dark-mode image variant.
- New `design.layout` enum: centered (default) | split-left |
split-right | stacked. Split layouts auto-set alignment to 'left'
unless explicitly overridden.
- Bump trust-strip star size from w-4 to w-5 for visual presence.
- Two new shared partials in layouts/_partials/functions/:
- resolve_image_resource: path → {resource | fallback_url}
- process_image_for_props: path → {src, srcset, width, height}
These factor out the resource-resolution + responsive-processing
pipeline so media-bearing blocks don't have to inline it.
- Capabilities registry: media-image, media-video, split-layouts.
- Landing page _index.md: keeps the centered hero (no behavioural
change) but documents the opt-in pattern for split layouts inline.
- Drop the orphan `pt-14` on the outer wrapper (was meant for
transparent floating headers; site headers don't need it)
- New `design.size` enum: compact | default | tall | viewport | none
- default (new): py-24 sm:py-32 lg:py-40 — modern 2026 baseline
(~30% less than the previous py-32 sm:py-48 lg:py-56)
- compact: utility heroes
- tall: the previous default — opt-in for splashy weight
- viewport: min-h-screen with vertical centring for splash heroes
- New `design.alignment` enum: center (default) | left
- Threads through eyebrow/title/subtitle/CTAs/trust/announcement
- 'left' is the prep work for Phase 3 split layouts
- Backward compat: `no_padding: true` still works — maps to size: "none"
when size is unset (legacy field marked deprecated in schema)
- Capabilities registry: size-presets, alignment
Responsive desktop table + mobile stacked-cards competitor comparison.
Supports category headings, boolean check/cross/partial and text cell
values, row striping, highlighted column with gradient border, and a
CTA row. Per-cell zebra striping opts out on the highlighted column to
avoid ring paint-order conflicts.
Replaces block.html with a Preact component featuring smooth CSS grid
0fr→1fr height animation, icon rotation, and multi-paragraph answer
support via renderRich(). Single-open accordion with question/title and
answer/text field aliases for backward compatibility.
Hugo v0.161's css.TailwindCSS reads node_modules/.bin/tailwindcss and
expects either a symlink or a Node-shebang script. pnpm's default
isolated linker creates shell wrappers (#!/bin/sh with NODE_PATH
manipulation), which Hugo rejects with "binary tailwindcss is not a
Node.js script". With node-linker=hoisted, pnpm flattens node_modules
and creates plain symlinks for Node-shebang bins — same shape npm
produces, which Hugo handles via its symlink branch in resolveNodeBin
(common/hexec/exec.go).
- Add .npmrc with node-linker=hoisted to all 9 templates and test/
- Verified end-to-end: academic-cv builds cleanly against published
modules/blox with Hugo v0.161.1
- Kit root and modules/blox keep pnpm's isolated linker for monorepo
The shipped per-template GitHub Actions build workflow still pinned
Node 20 and fell back to Hugo 0.154.5 on missing config - both
incompatible with Hugo v0.161's css.TailwindCSS Node permission sandbox
(Node >= 22, npm @tailwindcss/cli required). Sites upgraded via
`hugoblox upgrade` (which only touches go.mod) hit this immediately.
- Bump NODE_VERSION 20 -> 22 in all 9 templates' .github/workflows/build.yml
- Bump fallback DEFAULT_VERSION 0.154.5 -> 0.161.0 to match the framework's
new module.hugoVersion.min
- Add a "Verify Tailwind CSS dependency" step that fails fast with an
actionable ::error message if @tailwindcss/cli is not resolvable,
replacing Hugo's cryptic "binary tailwindcss is not a Node.js script"
Steps block:
- Three layouts: vertical (stacked with connector line), horizontal
(side-by-side, connector above), timeline (alternating cards on centre
line)
- Three marker styles: number (decimal/padded/roman/alpha), icon, dot
- Layout-aware marker sizing - bare 40px icon for horizontal, tinted
circle for vertical/timeline
- Staggered IntersectionObserver entrance animation
- Code span rendering in step body text
- Added to startup-landing-page template as a horizontal how-it-works
section
Replace legacy static Go HTML logos block with a Preact component. Adds three
layouts (row, grid, marquee), three filter styles (grayscale/color/white),
and three sizes (sm/md/lg). Fixed-width slots normalise visual weight across
SVG aspect ratios; per-item `scale` compensates for viewBox whitespace and
per-item `style` allows individual colour exceptions. Add logos block to startup-landing-page template.
Hugo v0.161 dropped the standalone tailwindcss binary; @tailwindcss/cli
npm package is now the only accepted transformer, invoked via
`node --permission` (Node >= 22 required).
- Bump module.hugoVersion.min to 0.161.0 in modules/blox/hugo.yaml;
add comment explaining why security.node.permissions is left to
Hugo's built-in defaults
- Bump hugo_version / HUGO_VERSION / devcontainer image tag to 0.161.0
across all 9 templates (hugoblox.yaml, netlify.toml, devcontainer.json)
- Bump devcontainer base image Node 20 → 22 and default Hugo version
- Add scripts/check-template-deps.mjs to assert every template declares
tailwindcss + @tailwindcss/cli; wire as pnpm check:template-deps
- Harden CI: new audit-template-deps job gates all build jobs; add
`require.resolve('@tailwindcss/cli/package.json')` check after each
pnpm install to catch the exact "binary is not a Node.js script" failure
Wire .hbb-section to var(--hb-spacing-section) instead of hardcoded 6rem,
enabling hugoblox.layout.spacing (compact/comfortable/spacious) to take effect.
- Default to "spacious" (6rem) to preserve existing visual layouts
- Per-section override via design.spacing.padding still works (inline > class)
- Remove dead design.spacing frontmatter field from all templates
- Set correct layout.spacing token in each template's params.yaml
Closes#3314
- Use design.spacing.padding to remove top padding on biography section
with banner image (previously caused a large 96px gap above the banner)
- Add proper vertical spacing (mt-4) between bio text and Download Résumé button
- Implement design.show_status option in both biography and biography-3 blocks
(config was accepted but never checked — status emoji always rendered)
Removes x-transition:leave directives from portfolio cards so hidden items
exit the grid flow immediately. This fixes two visual glitches when clicking
filter buttons: "ghost" cards briefly appearing during the overlap of enter
and leave animations, and cards snapping from their original grid position
to the start after a delayed reflow.
Fixes#3309
site_head.html, jsonld/article.html, jsonld/qapage.html, and
jsonld/event.html hardcode `(.Resources.ByType "image").GetMatch
"*featured*"` to find featured images. This ignores custom filenames
set via `.Params.image.filename` in front matter, causing og:image
and JSON-LD image to fall back to the site icon.
Replace the hardcoded pattern with the `get_featured_image` partial
(already used by jsonld/webpage.html), which properly searches for:
1. Files matching `*featured*` in the page directory
2. Custom filename from `.Params.image.filename` in the page directory
3. Custom filename in `assets/media/` directory
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
Add `actions/configure-pages` step to all template build workflows and
pass the detected base_url to `hugo --baseURL`, so sites deployed to
subdirectory paths (e.g. user.github.io/repo-name/) generate correct
asset URLs. Also fix leading-slash relURL calls in slides layout that
would ignore the baseURL path component.
George Cushen