themes-lcars/templates/overrides/lcars/rich-section.ninjatpl
Alex Dunmow d2d27b8dd9 fix(lcars): seed hero+cover art, styled empty-media fallback, SVG geometry guard + shortcode sweep, longer episode log
- seed: wire 6 licensed cosmic images (hero split art, episode cover, episode-card + about slots); kills the empty grey hero/cover boxes with real art
- theme fix: rich-section + episode_console render a labeled LCARS console-art readout for unset image slots instead of a bare grey rectangle
- dead space: home hero -> split layout (image fills post-CTA void); lengthen first-contact episode log to ~11 paragraphs (starfleet-log voice), warp/terraforming to 5
- SVG geometry guard: explicit width/height on all <use> icon SVGs; full shortcode sweep (::pack:name:size:: -> sized <svg><use>) across every override

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-06 19:35:15 +08:00

11 lines
1.5 KiB
Plaintext

{# rich-section override — two-column media + rich text, hairline surface options. #}
<section class="lcars-section {% if background == "muted" %}lcars-surface-muted{% elif background == "card" %}lcars-surface-card{% endif %} {{ class }}"><div class="lcars-content-well"><div class="lcars-grid lcars-grid-2" style="align-items: center;">
<div>
{% if eyebrow %}<p class="lcars-eyebrow">{{ eyebrow }}</p>{% endif %}
{% if heading %}<h2 class="lcars-heading" style="font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0 0 1rem 0;"><span class="lcars-heading-h2-accent">{{ heading }}</span></h2>{% endif %}
{% if body %}<div class="lcars-text" style="color: hsl(var(--muted-foreground)); line-height: 1.7;">{{ body|safe }}</div>{% endif %}
{% if ctaUrl and ctaLabel %}<a class="lcars-btn-ghost" href="{{ ctaUrl }}" style="margin-top: 1.5rem;">{{ ctaLabel }}<svg width="16" height="16" class="lcars-inline-icon" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"/></svg></a>{% endif %}
</div>
<div style="{% if mediaPosition == "left" %}order: -1;{% endif %}">{% if media %}<div class="lcars-media-frame" style="aspect-ratio: 4 / 3; background: hsl(var(--muted)); border: 1px solid hsl(var(--border)); overflow: hidden;">{% img media alt=mediaAlt class="lcars-rich-media" %}</div>{% else %}<div class="lcars-console-art"><span class="lcars-console-art-label">No signal</span><span class="lcars-console-art-scope" aria-hidden="true"><i></i><i></i><i></i><i></i><i></i></span></div>{% endif %}</div>
</div></div></section>