themes-noir/blocks/case_study.ninjatpl

2 lines
1.4 KiB
Plaintext

<section data-block="noir:case_study" class="py-12"><div class="max-w-6xl mx-auto px-6 grid grid-cols-1 md:grid-cols-[14rem_1fr] gap-10"><aside class="noir-meta-rail tracked-mono space-y-3">{% if client %}<div><div style="color: hsl(var(--mutedForeground));">Client</div><div class="mt-1" style="color: hsl(var(--foreground));">{{ client }}</div></div>{% endif %}{% if year|integer > 0 %}<div><div style="color: hsl(var(--mutedForeground));">Year</div><div class="mt-1" style="color: hsl(var(--foreground));">{{ year|integer }}</div></div>{% endif %}{% if credits %}<div><div style="color: hsl(var(--mutedForeground));">Credits</div><ul class="mt-1 space-y-1" style="color: hsl(var(--foreground));">{% for credit in credits %}<li>{{ credit }}</li>{% endfor %}</ul></div>{% endif %}</aside><div class="min-w-0">{% if title %}<h1 class="noir-display mb-10" style="font-size: clamp(2.5rem, 5vw, 4rem); line-height: 1.05; color: hsl(var(--foreground));">{{ title }}</h1>{% endif %}{% if images %}<div class="space-y-8">{% for img in images %}{% if img %}<figure class="noir-figure"><img src="{{ img }}" alt="{{ title }}" loading="lazy" class="w-full h-auto block"></figure>{% endif %}{% endfor %}</div>{% else %}<div class="hairline p-12 text-center tracked-mono" style="color: hsl(var(--mutedForeground));">Add photographs to the case study spread.</div>{% endif %}</div></div></section>