Compare commits

..

1 Commits

Author SHA1 Message Date
nvrl 0bd27dd7ef modified blog posts
CI / frontend (pull_request) Successful in 36s
CI / backend (pull_request) Failing after 20s
2026-05-18 14:33:58 +02:00
2 changed files with 6 additions and 48 deletions
+6 -16
View File
@@ -78,7 +78,7 @@ const displayTitle = post ? (post.title || formatSlug(post.slug)) : 'Work';
image={post?.cover_image?.url} image={post?.cover_image?.url}
type="article" type="article"
> >
{post?.cover_image?.url && ( {!isBlog && post?.cover_image?.url && (
<Fragment slot="head"> <Fragment slot="head">
<link rel="preload" as="image" href={post.cover_image.url} fetchpriority="high" /> <link rel="preload" as="image" href={post.cover_image.url} fetchpriority="high" />
</Fragment> </Fragment>
@@ -113,20 +113,6 @@ const displayTitle = post ? (post.title || formatSlug(post.slug)) : 'Work';
)} )}
</div> </div>
{/* Blog mode: cover rides above the plaque as a lead image. In atelier
the cover is the index plate's job, not the post page's. */}
{isBlog && post.cover_image?.url && (
<div class="post-lead">
<img
src={post.cover_image.url}
alt={post.cover_image.alt || displayTitle}
width={post.cover_image.w}
height={post.cover_image.h}
fetchpriority="high"
/>
</div>
)}
{/* Plaque header */} {/* Plaque header */}
<header class="max-w-3xl mx-auto text-center mb-12 md:mb-16"> <header class="max-w-3xl mx-auto text-center mb-12 md:mb-16">
<h1 class="font-display italic font-semibold text-[var(--text)] text-4xl md:text-6xl lg:text-7xl leading-[1.08] tracking-tight mb-6"> <h1 class="font-display italic font-semibold text-[var(--text)] text-4xl md:text-6xl lg:text-7xl leading-[1.08] tracking-tight mb-6">
@@ -174,7 +160,11 @@ const displayTitle = post ? (post.title || formatSlug(post.slug)) : 'Work';
{/* Body — works on paper */} {/* Body — works on paper */}
<div id="post-content" class="prose" set:html={html} /> <div id="post-content" class="prose" set:html={html} />
{(neighbors.prev || neighbors.next) && ( {isBlog ? (
<div class="max-w-3xl mx-auto mt-20 md:mt-28 text-center">
<a href="/" class="btn btn--ghost">← {c.backHome}</a>
</div>
) : (neighbors.prev || neighbors.next) && (
<nav class="post-nav max-w-3xl mx-auto mt-20 md:mt-28 grid grid-cols-1 md:grid-cols-2 gap-6" aria-label="Post navigation"> <nav class="post-nav max-w-3xl mx-auto mt-20 md:mt-28 grid grid-cols-1 md:grid-cols-2 gap-6" aria-label="Post navigation">
{neighbors.prev && ( {neighbors.prev && (
<a href={`/posts/${encodeURIComponent(neighbors.prev.slug)}`} class="group glass p-6 hover:border-[var(--mauve)] transition-colors text-left"> <a href={`/posts/${encodeURIComponent(neighbors.prev.slug)}`} class="group glass p-6 hover:border-[var(--mauve)] transition-colors text-left">
-32
View File
@@ -174,35 +174,3 @@ html.mode-blog .post-row-draft {
aspect-ratio: 16 / 9; aspect-ratio: 16 / 9;
} }
} }
/* ── Post page (blog mode): cover as a lead image above the plaque ── */
html.mode-blog .post-lead {
position: relative;
max-width: 48rem;
margin: 0 auto 2.5rem;
overflow: hidden;
background: var(--mantle);
border: 1px solid var(--surface2);
border-radius: 2px;
box-shadow:
inset 0 0 0 1px color-mix(in srgb, var(--surface1) 50%, transparent),
0 26px 50px -30px rgba(20, 16, 12, 0.55);
}
html.salon-noir.mode-blog .post-lead,
html.gothic.mode-blog .post-lead {
box-shadow:
inset 0 0 0 1px color-mix(in srgb, var(--surface1) 50%, transparent),
0 26px 50px -30px rgba(0, 0, 0, 0.8);
}
html.breakcore.mode-blog .post-lead {
border-color: color-mix(in srgb, var(--mauve) 40%, var(--surface2));
box-shadow:
inset 0 0 0 1px color-mix(in srgb, var(--mauve) 28%, transparent),
0 0 34px -12px color-mix(in srgb, var(--mauve) 45%, transparent);
}
html.mode-blog .post-lead img {
display: block;
width: 100%;
height: auto;
filter: saturate(0.95) contrast(1.02);
}