themes-brutalist/templates/overrides/brutalist/featured-posts.ninjatpl
Alex Dunmow 6c03f6da6c feat(brutalist): Wave A override contract — 49 builtin overrides, 7 templates, seed
WO-TF-012. Neo-brutalist creative-studio theme brought up to the Wave A
OVERRIDE-CONTRACT (frozen against cms a0f07e2ae).

- Override all 49 mandatory builtin keys in templates/overrides/brutalist/
  (chrome, marketing, primitives, commerce, blog family, auth surface, 404),
  each carrying the brutalist chrome (chunky borders, hard offset shadows,
  hover snap, mono uppercase meta, candy accents) via a raw-CSS "bru-*" kit
  shipped in manifest.yaml. Load-bearing wiring (HTMX auth endpoints, signup
  form, contact-form submit + honeypot, facade scripts, lightbox) preserved
  verbatim.
- 7 page templates: default, full-width, landing, article, blog-index,
  contact, auth (fixed a bug where templates omitted the `dark` class so dark
  presets never activated).
- Blocks rework: removed 6 blocks that duplicated builtins (masthead,
  concrete_hero, meta_strip, caption_image, pull_quote, colophon) — now
  overrides; kept project_ledger; added persona blocks sticker_wall,
  changelog, spec_sheet (4 total).
- 4 dual-mode presets (all mode "both", 19 tokens light + dark): Concrete &
  Cadmium, Hazard, Riso, Acid.
- Bundled 8 latin-subset OFL woff2 (Space Grotesk, Archivo Black, Inter, IBM
  Plex Mono) in assets/fonts/ + LICENSES.md; fonts.json populated; all
  font-family via var(--font-*). RECOMMENDED_FONTS/ICONS updated;
  required_icon_packs declared.
- Email-safe themed wrapper (tables, inline styles) cleaned up.
- master_pages.json reworked to builtin navbar/hero/cta/footer.
- Demo seed (seed/seed.json + workflows.json, demo:true): home, about, blog
  (3 posts), contact (form + contact_submissions data table + row_inserted →
  email-admins workflow), login — studio voice.

Known codeless limitation: page-suggestions renders themed 404 chrome but the
similar-pages list (server-side DB query, no template provider) can't be
reproduced; auth-form captcha widget is server-generated and can't be emitted
(seed leaves captchaEnabled=false). Verified: make exit 0; check-safety
exit 0. Visual quality UNVERIFIED until Wave B.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-05 10:56:49 +08:00

23 lines
1.7 KiB
Plaintext

{# brutalist featured-posts override — grid of bordered slab cards from the `posts` provider. Fields: heading, columns, posts[], showFeaturedImage, showExcerpt, showAuthor, showDate. #}
<section class="bru-section bg-background text-foreground{% if class %} {{ class }}{% endif %}">
<div class="bru-wrap">
{% if heading %}<h2 class="bru-kicker mb-8" style="font-size:clamp(1.75rem,4vw,3rem)">{{ heading }}</h2>{% endif %}
<div class="grid grid-cols-1 gap-6 sm:grid-cols-2 {% if columns == 2 %}lg:grid-cols-2{% elif columns == 4 %}lg:grid-cols-4{% else %}lg:grid-cols-3{% endif %}">
{% for post in posts %}
<article class="group bru-slab bru-shadow bru-hover flex flex-col overflow-hidden">
{% if showFeaturedImage and post.featured_image_url %}<a href="{{ post.url }}" class="block aspect-video overflow-hidden bg-muted" style="border-bottom:3px solid hsl(var(--border))">{% img post.featured_image_url alt=post.title class="h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" %}</a>{% endif %}
<div class="flex flex-1 flex-col p-5">
<h3 class="bru-kicker text-lg leading-snug" style="text-transform:none"><a href="{{ post.url }}" class="transition-colors hover:text-accent">{{ post.title }}</a></h3>
{% if showExcerpt and post.excerpt %}<p class="mt-2 flex-1 text-sm text-muted-foreground">{{ post.excerpt }}</p>{% endif %}
<div class="bru-meta mt-4 flex flex-wrap items-center gap-x-3 gap-y-1">
{% if showAuthor and post.author_name %}<span class="text-foreground">{{ post.author_name }}</span>{% endif %}
{% if showDate and post.published_at %}<span>{{ post.published_at|date:"M j, Y" }}</span>{% endif %}
{% if post.reading_time %}<span>{{ post.reading_time }} min read</span>{% endif %}
</div>
</div>
</article>
{% endfor %}
</div>
</div>
</section>