mark/msos
0
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(blog): use each published post hero image on the blog listing cards

Browse Source 
The blog index cards showed placeholder icons even for published posts that
have a hero image. Replace the icon thumb with the post hero (cover-cropped)
for every published card in EN/MK/SI, and add a .blog-thumb--image rule to
mirror the existing featured-card image style. Coming-soon / unpublished cards
keep their icons.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
popovskikandClaude Opus 4.8 committed 2026-08-27 16:43:18 +02:00
1 parent 9a9eec21c5
commit fb0c5c8639
4 files changed
+28 -18
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

css/pages/_blog.css
+10
View File
@@ -186,6 +186,16 @@ a.blog-card { text-decoration: none; color: inherit; }
/* Vary the placeholder heights so the wall feels playful, not uniform */
.blog-card:nth-child(3n+1) .blog-thumb { min-height: 180px; }
.blog-card:nth-child(4n+2) .blog-thumb { min-height: 120px; }
/* Real cover image inside a card thumb (replaces the icon placeholder) */
.blog-thumb--image { position: relative; padding: 0; }
.blog-thumb--image img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.blog-card-body { padding: 18px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.blog-card h3 { margin: 0; font-size: 18px; line-height: 1.3; color: #101828; }
.blog-card p { margin: 0; font-size: 14px; line-height: 22px; color: #667085; }