WO-TF-024. Re-skin from frozen Wave-0 builtins into blueprint/HUD/mono chrome (AI/robotics product persona), preserving every content field, provider field, custom tag, and JS block; button/card legacy field reads reconciled per §4. - 49 mandatory template_overrides + 7 page templates (default, full-width, landing, article, blog-index, contact, auth) with MID-tier motion (JS scroll-reveal + ticking counters + CSS line-draw; reduced-motion + no-JS static fallback). - 4 persona blocks: tech_spec, benchmark_table, telemetry_grid, changelog_console. Deleted 5 builtin-duplicating theme blocks (now overrides). - 4 dual-mode presets (19 tokens, light + dark tuned). - Bundled OFL fonts (Space Grotesk / Inter / JetBrains Mono) + LICENSES. - Email-safe wrapper retuned; master pages + seed demo site (Halcyon Robotics: home, about, blog x3, contact with data-table + row_inserted email workflow, login). - required_icon_packs (lucide, simple-icons) + RECOMMENDED docs. make build exit 0 (codeless .bnp); check-safety exit 0. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
27 lines
3.3 KiB
Plaintext
27 lines
3.3 KiB
Plaintext
{# hero override — schematic HUD headline over blueprint restraint. #}
|
|
{# styled-text fields accept a {text,color} object OR a bare string (.text|default:field). #}
|
|
{# MID motion: .sc-schematic line draws in via the page-template script; no-JS static. #}
|
|
{% set eyebrowText = eyebrow.text|default:eyebrow %}
|
|
{% set headlineText = headline.text|default:headline %}
|
|
{% set subText = subheadline.text|default:subheadline %}
|
|
{% set descText = description.text|default:description %}
|
|
{% set pText = ctaPrimary.text %}
|
|
{% set pUrl = ctaPrimary.url %}
|
|
{% set sText = ctaSecondary.text %}
|
|
{% set sUrl = ctaSecondary.url %}
|
|
{% set variant = template|default:"centered" %}
|
|
{% macro herobody() %}
|
|
{% if eyebrowText %}<p class="sc-eyebrow">{{ eyebrowText }}</p>{% endif %}
|
|
<div class="sc-schematic" data-sc-reveal style="max-width: 11rem; margin: 0 0 1.25rem 0;"><div class="sc-schematic-line"></div></div>
|
|
{% if headlineText %}<h1 class="sc-hero-headline sc-display" style="font-size: clamp(2.5rem, 6vw, 4.5rem); line-height: 1.02; letter-spacing: -0.03em; margin: 0; color: hsl(var(--foreground));">{{ headlineText }}</h1>{% endif %}
|
|
{% if subText %}<p class="sc-hero-sub sc-lede" style="margin: 1.25rem 0 0 0; font-size: 1.25rem; line-height: 1.5; color: hsl(var(--muted-foreground)); max-width: 60ch;">{{ subText }}</p>{% endif %}
|
|
{% if descText %}<p class="sc-text" style="margin: 1rem 0 0 0; color: hsl(var(--muted-foreground)); max-width: 60ch;">{{ descText }}</p>{% endif %}
|
|
{% if pText or sText %}<div class="sc-btn-row" style="display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 2rem;">{% if pText and pUrl %}<a class="sc-btn-primary sc-btn-lg" href="{{ pUrl }}">{{ pText }}</a>{% endif %}{% if sText and sUrl %}<a class="sc-btn-outline sc-btn-lg" href="{{ sUrl }}">{{ sText }}</a>{% endif %}</div>{% endif %}
|
|
{% if trustLogos %}<div class="sc-hairline-top" style="margin-top: 3rem; padding-top: 1.5rem;"><p class="sc-kicker sc-eyebrow" style="margin-bottom: 1rem; color: hsl(var(--muted-foreground));">Trusted by</p><div class="sc-logo-row" style="display: flex; flex-wrap: wrap; align-items: center; gap: 2rem;">{% for logo in trustLogos %}{% if logo.url %}<a href="{{ logo.url }}">{% img logo.image alt=logo.alt class="sc-logo" %}</a>{% else %}{% img logo.image alt=logo.alt class="sc-logo" %}{% endif %}{% endfor %}</div></div>{% endif %}
|
|
{% endmacro %}
|
|
{% if variant == "split" %}
|
|
<section class="sc-hero sc-hero-split {{ class }}" style="padding-top: 4rem; padding-bottom: 4rem;"><div class="sc-content-well"><div class="sc-grid sc-grid-2" style="align-items: center;"><div>{{ herobody() }}</div><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 %}">{% if backgroundImage %}{% img backgroundImage alt=headlineText class="sc-hero-media" %}{% endif %}</div></div></div></section>
|
|
{% else %}
|
|
<section class="sc-hero {{ class }}" style="padding-top: 5rem; padding-bottom: 5rem; {% if variant == "left-aligned" %}text-align: left;{% else %}text-align: center;{% endif %}"><div class="sc-content-well" style="{% if variant != "left-aligned" %}display: flex; flex-direction: column; align-items: center;{% endif %}"><div style="max-width: 60ch; width: 100%;">{{ herobody() }}</div></div></section>
|
|
{% endif %}
|