jwright/bztmon-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

blog: hero images + publish secret-zero
build-and-deploy / build (push) Failing after 11m14s
Details

Browse Source 
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:
Jonathon Wright
2026-06-29 17:37:40 +10:00
parent d8a147aabe
commit 354475a453
12 changed files with 154 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/PostList.astro
+38 -12
View File
@@ -14,18 +14,25 @@ const { posts } = Astro.props;
posts.map((post) => (
<li class="post" data-reveal>
<a class="post__link" href={`/blog/${post.id}/`}>
<div class="post__meta mono">
<time datetime={post.data.date.toISOString()}>{formatDate(post.data.date)}</time>
<span class="post__sep">·</span>
<span>{readingTime(post.body)}</span>
{post.data.hero && (
<div class="post__thumb">
<img src={`${post.data.hero}?v=1`} alt="" width="1600" height="1073" loading="lazy" decoding="async" />
</div>
)}
<div class="post__card-body">
<div class="post__meta mono">
<time datetime={post.data.date.toISOString()}>{formatDate(post.data.date)}</time>
<span class="post__sep">·</span>
<span>{readingTime(post.body)}</span>
</div>
<h3 class="post__title">{post.data.title}</h3>
<p class="post__summary">{post.data.summary}</p>
<ul class="post__tags">
{post.data.tags.map((t) => (
<li class="tag">{t}</li>
))}
</ul>
</div>
<h3 class="post__title">{post.data.title}</h3>
<p class="post__summary">{post.data.summary}</p>
<ul class="post__tags">
{post.data.tags.map((t) => (
<li class="tag">{t}</li>
))}
</ul>
</a>
</li>
))
@@ -42,13 +49,32 @@ const { posts } = Astro.props;
}
.post__link {
display: block;
padding: var(--space-5);
overflow: hidden;
border: 1px solid var(--border);
border-radius: var(--radius);
background: var(--surface);
color: inherit;
transition: border-color 0.2s var(--ease), transform 0.2s var(--ease);
}
.post__thumb {
aspect-ratio: 1600 / 1073;
overflow: hidden;
border-bottom: 1px solid var(--border);
background: var(--surface-2);
}
.post__thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s var(--ease);
}
.post__link:hover .post__thumb img {
transform: scale(1.03);
}
.post__card-body {
padding: var(--space-5);
}
.post__link:hover {
text-decoration: none;
border-color: var(--accent-line);