d2d27b8dd9
- 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>
15 lines
3.0 KiB
Plaintext
15 lines
3.0 KiB
Plaintext
{# pricing override — flat hairline tiers, mono price figures, accent-top featured tier. #}
|
|
<section class="lcars-section {{ class }}"><div class="lcars-content-well">
|
|
{% if heading %}<h2 class="lcars-heading" style="font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0 0 0.75rem 0;"><span class="lcars-heading-h2-accent">{{ heading }}</span></h2>{% endif %}
|
|
{% if intro %}<p class="lcars-lede" style="max-width: 60ch; margin: 0 0 2.5rem 0; color: hsl(var(--muted-foreground));">{{ intro }}</p>{% endif %}
|
|
{% if tiers %}<div class="lcars-grid lcars-grid-3">{% for tier in tiers %}<div class="lcars-card lcars-price-tier {% if tier.highlighted %}lcars-price-tier--featured lcars-card-accent{% endif %}" style="display: flex; flex-direction: column;">
|
|
{% if tier.badge %}<span class="lcars-badge" style="display: inline-block; align-self: flex-start; background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; padding: 0.25rem 0.5rem; border-radius: 4px; margin-bottom: 0.75rem;">{{ tier.badge }}</span>{% endif %}
|
|
{% if tier.name %}<h3 class="lcars-feature-title" style="margin: 0;">{{ tier.name }}</h3>{% endif %}
|
|
<p style="display: flex; align-items: baseline; gap: 0.25rem; margin: 1rem 0 0 0;"><span class="lcars-price numeric-tabular" style="font-family: var(--font-mono, ui-monospace, monospace); font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 500; line-height: 1; color: hsl(var(--foreground));">{% if currency %}{{ currency }}{% else %}${% endif %}{{ tier.price }}</span>{% if tier.period %}<span class="lcars-price-period lcars-stat-label" style="margin-top: 0;">{{ tier.period }}</span>{% endif %}</p>
|
|
{% if tier.description %}<p class="lcars-text" style="font-size: 0.9375rem; color: hsl(var(--muted-foreground)); margin-top: 0.75rem;">{{ tier.description }}</p>{% endif %}
|
|
{% if tier.features %}<ul class="lcars-stack-sm" style="list-style: none; padding: 0; margin: 1.5rem 0 0 0; display: flex; flex-direction: column; gap: 0.625rem; flex: 1;">{% for feature in tier.features %}<li class="lcars-check" style="display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.9375rem; color: hsl(var(--foreground));"><span style="color: hsl(var(--accent)); flex: none;"><svg width="16" height="16" class="lcars-inline-icon" aria-hidden="true"><use href="/icons/lucide.svg#check"/></svg></span><span>{{ feature }}</span></li>{% endfor %}</ul>{% endif %}
|
|
{% if tier.ctaUrl and tier.ctaLabel %}{% if tier.highlighted %}<a class="lcars-btn-primary" href="{{ tier.ctaUrl }}" style="margin-top: 1.5rem; width: 100%; box-sizing: border-box; text-align: center;">{{ tier.ctaLabel }}</a>{% else %}<a class="lcars-btn-outline" href="{{ tier.ctaUrl }}" style="margin-top: 1.5rem; width: 100%; box-sizing: border-box; text-align: center;">{{ tier.ctaLabel }}</a>{% endif %}{% endif %}
|
|
</div>{% endfor %}</div>{% endif %}
|
|
{% if billingNote %}<p class="lcars-stat-label" style="text-align: center; margin-top: 2rem;">{{ billingNote }}</p>{% endif %}
|
|
</div></section>
|