gurixandClaude
f46e4178d2
- Moved homepage-recent-posts to archive with 2025-10-31 date - Created new spec at specs/homepage-recent-posts/ - All validation checks pass 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
79 lines
2.9 KiB
Markdown
79 lines
2.9 KiB
Markdown
# Tasks: Display Recent Blog Posts on Homepage
|
|
|
|
## Implementation Tasks
|
|
|
|
### 1. Update Homepage Template
|
|
- [x] Modify `layouts/index.html` to query recent blog posts
|
|
- [x] Add Hugo template logic to fetch 3 most recent posts from blog section
|
|
- [x] Filter posts by current language context
|
|
- [x] Sort posts by publication date (descending)
|
|
|
|
**Validation:**
|
|
- Template syntax is correct (no Hugo build errors)
|
|
- Recent posts query respects language context
|
|
- Exactly 3 posts are retrieved (or fewer if less exist)
|
|
|
|
### 2. Implement Recent Posts Section UI
|
|
- [x] Add semantic HTML structure for recent posts section
|
|
- [x] Include section heading (translatable: "Neueste Beiträge" / "Recent Posts")
|
|
- [x] Display each post as list item with title link and date
|
|
- [x] Apply Bootstrap classes for consistent styling
|
|
- [x] Add appropriate spacing after description section
|
|
|
|
**Validation:**
|
|
- Section heading displays correctly in both languages
|
|
- Post titles are clickable links using `relPermalink`
|
|
- Dates are formatted using Hugo's date formatting
|
|
- Bootstrap classes match existing site patterns
|
|
- Visual spacing separates description from recent posts
|
|
|
|
### 3. Add Multilingual Section Headings
|
|
- [x] Implement conditional heading based on language context
|
|
- [x] German: "Neueste Beiträge" or "Aktuelle Artikel"
|
|
- [x] English: "Recent Posts" or "Latest Articles"
|
|
- [x] Use Hugo's language detection (`{{ .Language.Lang }}`)
|
|
|
|
**Validation:**
|
|
- German homepage shows German heading
|
|
- English homepage shows English heading
|
|
- Heading style matches other section headings on the site
|
|
|
|
### 4. Test and Verify
|
|
- [x] Build site with `hugo` command
|
|
- [x] Verify German homepage (/de/) displays recent German posts
|
|
- [x] Verify English homepage (/en/) displays recent English posts
|
|
- [x] Test with different numbers of blog posts (0, 1, 2, 3, 5+)
|
|
- [x] Check responsive layout on mobile viewport
|
|
- [x] Verify all links navigate correctly
|
|
|
|
**Validation:**
|
|
- Hugo build completes without errors
|
|
- Both language versions render correctly
|
|
- Edge cases handled (0 posts, < 3 posts)
|
|
- Links preserve language context
|
|
- Layout is responsive and accessible
|
|
|
|
### 5. Performance Check
|
|
- [x] Measure HTML file size increase
|
|
- [x] Verify no new HTTP requests added
|
|
- [x] Confirm build time impact is negligible
|
|
- [x] Optional: Run Lighthouse audit
|
|
|
|
**Validation:**
|
|
- File size increase < 2KB
|
|
- No additional network requests
|
|
- Build time difference < 100ms
|
|
- Performance score remains high
|
|
|
|
## Dependencies
|
|
- Task 1 must complete before Task 2
|
|
- Task 2 and 3 can be done in parallel or sequentially
|
|
- Task 4 requires all implementation tasks (1-3) complete
|
|
- Task 5 can be done after Task 4
|
|
|
|
## Notes
|
|
- Keep implementation minimal and focused on title + date only
|
|
- Use existing blog post querying patterns if any exist in the codebase
|
|
- Ensure null/empty checks to handle cases with no blog posts
|
|
- Consider using Hugo's `.Site.RegularPages` or `.Site.Taxonomies` for blog queries
|