Layout / whitespace:
- Root-cause blank hero: seed passed hero styled-text (eyebrow/headline/
subheadline) as bare strings, but the hero template does field.text|default:field
and the ninjatpl engine throws a hard error on attribute-access-on-string, so the
whole hero (and the builtin fallback) errored and rendered as an empty ~160px band.
Seed now passes {text:...} objects (the builtin-sample / admin-editor format).
- tech_spec table: value + unit were both right-aligned, leaving a cavernous mid-gap;
label column now absorbs slack and value+unit group together on the right. Box
narrowed (34rem) with tighter padding so the HUD corners frame a deliberate panel.
- Tightened section rhythm (sc-section 4->3.5rem, sc-section-tight 2.5->2.75rem) and
hero bottom padding to remove oversized inter-section gaps.
- Defined sc-article-measure (was referenced but undefined -> unbounded line length).
Empty-media graceful state (seed ships no images):
- rich-section and hero (split) rendered an empty aspect-ratio muted box when media
was absent; media frame is now guarded and the grid collapses to one column.
Mobile responsiveness (explicit sc-* classes + @media, not JIT-scanned Tailwind):
- sc-form-grid (global + contact-form scoped) collapses to 1 column <=640px.
- gallery dropped inline grid-template-columns that overrode its responsive classes,
so 3/4-col galleries now collapse on small screens.
- nav toggle tap target bumped to 42x42px.
Motion robustness:
- Added a safety-net full-reveal timeout to the scroll-reveal script so below-fold
[data-sc-reveal] content is guaranteed visible on no-scroll screenshot captures and
IntersectionObserver edge cases. Reduced-motion / no-JS already render fully.
Semantic tokens only; check-safety 32 checks 19 ok 13 skip -> OK; codeless build OK.
No version bump.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
11 lines
1.2 KiB
Plaintext
11 lines
1.2 KiB
Plaintext
{# rich-section override — two-column media + rich text, hairline surface options. #}
|
|
<section class="sc-section {% if background == "muted" %}sc-surface-muted{% elif background == "card" %}sc-surface-card{% endif %} {{ class }}"><div class="sc-content-well"><div class="sc-grid {% if media %}sc-grid-2{% endif %}" style="align-items: center;">
|
|
<div>
|
|
{% if eyebrow %}<p class="sc-eyebrow">{{ eyebrow }}</p>{% endif %}
|
|
{% if heading %}<h2 class="sc-heading" style="font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0 0 1rem 0;"><span class="sc-heading-h2-accent">{{ heading }}</span></h2>{% endif %}
|
|
{% if body %}<div class="sc-text" style="color: hsl(var(--muted-foreground)); line-height: 1.7;">{{ body|safe }}</div>{% endif %}
|
|
{% if ctaUrl and ctaLabel %}<a class="sc-btn-ghost" href="{{ ctaUrl }}" style="margin-top: 1.5rem;">{{ ctaLabel }}::lucide:arrow-right:sm::</a>{% endif %}
|
|
</div>
|
|
{% if media %}<div class="sc-media-frame" style="aspect-ratio: 4 / 3; background: hsl(var(--muted)); border: 1px solid hsl(var(--border)); overflow: hidden; {% if mediaPosition == "left" %}order: -1;{% endif %}">{% img media alt=mediaAlt class="sc-rich-media" %}</div>{% endif %}
|
|
</div></div></section>
|