Add an optional hero field to the blog schema; render it on the post page and as the index card thumbnail. Ship 4 verified Nano Banana hero images (shipping/ init-gating/authentik/workload) as optimized webp (64-134KB). Publish the secret-zero post. (outbound hero pending — its file was a dup of shipping; secret-zero hero pending generation.)
This commit is contained in:
@@ -33,6 +33,19 @@ const { Content } = await render(entry);
|
||||
</ul>
|
||||
</header>
|
||||
|
||||
{entry.data.hero && (
|
||||
<figure class="post__hero" data-reveal>
|
||||
<img
|
||||
src={`${entry.data.hero}?v=1`}
|
||||
alt={entry.data.heroAlt ?? entry.data.title}
|
||||
width="1600"
|
||||
height="1073"
|
||||
loading="eager"
|
||||
decoding="async"
|
||||
/>
|
||||
</figure>
|
||||
)}
|
||||
|
||||
<div class="prose post__body" data-reveal>
|
||||
<Content />
|
||||
</div>
|
||||
@@ -45,6 +58,20 @@ const { Content } = await render(entry);
|
||||
max-width: 48rem;
|
||||
padding-block: var(--space-7);
|
||||
}
|
||||
.post__hero {
|
||||
margin: var(--space-6) 0 var(--space-7);
|
||||
border-radius: var(--radius);
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--border);
|
||||
box-shadow: var(--shadow), 0 0 30px var(--accent-glow);
|
||||
background: var(--surface);
|
||||
}
|
||||
.post__hero img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 1600 / 1073;
|
||||
}
|
||||
.post__back {
|
||||
display: inline-block;
|
||||
font-size: var(--step--1);
|
||||
|
||||
Reference in New Issue
Block a user