fe754f634b
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/magazine-bold. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
47 lines
1.3 KiB
Plaintext
47 lines
1.3 KiB
Plaintext
package main
|
|
|
|
// coverStoryComponent renders the 12-column asymmetric cover hero.
|
|
// Note: the spec calls for an oversized display headline; this consumes
|
|
// `--font-heading` via .font-display and clamps via .text-folio.
|
|
templ coverStoryComponent(data CoverStoryData) {
|
|
<section data-block="magazine-bold:cover_story" class="w-full py-12">
|
|
<div class="max-w-6xl mx-auto px-6">
|
|
<div class="mb-grid-asym-cover">
|
|
<div class="mb-col-folio">
|
|
if data.Kicker != "" {
|
|
<div class="font-mono text-kicker text-muted-foreground mb-4">{ data.Kicker }</div>
|
|
}
|
|
</div>
|
|
<div class="mb-col-headline">
|
|
<h1 class="font-display text-folio text-foreground">
|
|
if data.Headline != "" {
|
|
@templ.Raw(data.Headline)
|
|
} else {
|
|
Cover story
|
|
}
|
|
</h1>
|
|
</div>
|
|
<div class="mb-col-deck">
|
|
if data.Deck != "" {
|
|
<div class="font-sans text-deck text-muted-foreground">
|
|
@templ.Raw(data.Deck)
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
if data.Image != "" {
|
|
<div class="mt-10">
|
|
<img src={ data.Image } alt="" class="w-full h-auto block" loading="lazy"/>
|
|
</div>
|
|
}
|
|
if data.Link != "" {
|
|
<div class="mt-6">
|
|
<a href={ templ.SafeURL(data.Link) } class="mb-button">
|
|
Read the story →
|
|
</a>
|
|
</div>
|
|
}
|
|
</div>
|
|
</section>
|
|
}
|