1bebbea5ad
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/noir. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
54 lines
1.7 KiB
Plaintext
54 lines
1.7 KiB
Plaintext
package main
|
|
|
|
// caseStudyComponent renders a project case-study spread with a sticky meta rail.
|
|
templ caseStudyComponent(data CaseStudyData) {
|
|
<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 data.Client != "" {
|
|
<div>
|
|
<div style="color: hsl(var(--mutedForeground));">Client</div>
|
|
<div class="mt-1" style="color: hsl(var(--foreground));">{ data.Client }</div>
|
|
</div>
|
|
}
|
|
if data.Year > 0 {
|
|
<div>
|
|
<div style="color: hsl(var(--mutedForeground));">Year</div>
|
|
<div class="mt-1" style="color: hsl(var(--foreground));">{ intToString(data.Year) }</div>
|
|
</div>
|
|
}
|
|
if len(data.Credits) > 0 {
|
|
<div>
|
|
<div style="color: hsl(var(--mutedForeground));">Credits</div>
|
|
<ul class="mt-1 space-y-1" style="color: hsl(var(--foreground));">
|
|
for _, credit := range data.Credits {
|
|
<li>{ credit }</li>
|
|
}
|
|
</ul>
|
|
</div>
|
|
}
|
|
</aside>
|
|
<div class="min-w-0">
|
|
if data.Title != "" {
|
|
<h1 class="noir-display mb-10" style="font-size: clamp(2.5rem, 5vw, 4rem); line-height: 1.05; color: hsl(var(--foreground));">
|
|
{ data.Title }
|
|
</h1>
|
|
}
|
|
if len(data.Images) > 0 {
|
|
<div class="space-y-8">
|
|
for _, img := range data.Images {
|
|
<figure class="noir-figure">
|
|
<img src={ img } alt={ data.Title } loading="lazy" class="w-full h-auto block"/>
|
|
</figure>
|
|
}
|
|
</div>
|
|
} else {
|
|
<div class="hairline p-12 text-center tracked-mono" style="color: hsl(var(--mutedForeground));">
|
|
Add photographs to the case study spread.
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
}
|