88 lines
3.7 KiB
Markdown
88 lines
3.7 KiB
Markdown
|
# Spec: Homepage Recent Posts Display
|
||
|
|
|
||
|
|
## ADDED Requirements
|
||
|
|
|
||
|
|
### Requirement: Display Recent Blog Posts on Homepage
|
||
|
|
The homepage MUST display the 3 most recent blog posts immediately after the user's description content section.
|
||
|
|
|
||
|
|
#### Scenario: Three most recent posts are displayed
|
||
|
|
**Given** the blog section contains 5 published posts
|
||
|
|
**When** a visitor accesses the homepage
|
||
|
|
**Then** exactly 3 most recent posts are displayed
|
||
|
|
**And** posts are ordered by publication date (newest first)
|
||
|
|
|
||
|
|
#### Scenario: Fewer than three posts exist
|
||
|
|
**Given** the blog section contains only 2 published posts
|
||
|
|
**When** a visitor accesses the homepage
|
||
|
|
**Then** all 2 posts are displayed
|
||
|
|
**And** no error or empty slots are shown
|
||
|
|
|
||
|
|
#### Scenario: No blog posts exist
|
||
|
|
**Given** the blog section contains no published posts
|
||
|
|
**When** a visitor accesses the homepage
|
||
|
|
**Then** the recent posts section is not displayed
|
||
|
|
**And** the homepage layout remains intact
|
||
|
|
|
||
|
|
### Requirement: Post Display Format
|
||
|
|
Each displayed blog post MUST show the post title as a clickable link and the publication date.
|
||
|
|
|
||
|
|
#### Scenario: Post title is clickable
|
||
|
|
**Given** a blog post is displayed on the homepage
|
||
|
|
**When** a visitor clicks the post title
|
||
|
|
**Then** they are navigated to the full blog post page
|
||
|
|
**And** the language context is preserved (German homepage → German post, English homepage → English post)
|
||
|
|
|
||
|
|
#### Scenario: Publication date is formatted correctly
|
||
|
|
**Given** a blog post with date "2025-10-30" is displayed
|
||
|
|
**When** viewing the German homepage
|
||
|
|
**Then** the date is formatted as "30. October 2025"
|
||
|
|
**When** viewing the English homepage
|
||
|
|
**Then** the date is formatted as "October 30, 2025"
|
||
|
|
|
||
|
|
### Requirement: Multilingual Support
|
||
|
|
The recent posts section MUST respect the site's multilingual configuration and display language-appropriate content.
|
||
|
|
|
||
|
|
#### Scenario: German homepage shows German posts
|
||
|
|
**Given** the visitor accesses the German homepage (/de/)
|
||
|
|
**When** the recent posts section is rendered
|
||
|
|
**Then** only German blog posts are displayed
|
||
|
|
**And** the section heading is in German (e.g., "Neueste Beiträge")
|
||
|
|
|
||
|
|
#### Scenario: English homepage shows English posts
|
||
|
|
**Given** the visitor accesses the English homepage (/en/)
|
||
|
|
**When** the recent posts section is rendered
|
||
|
|
**Then** only English blog posts are displayed
|
||
|
|
**And** the section heading is in English (e.g., "Recent Posts")
|
||
|
|
|
||
|
|
### Requirement: Visual Design and Layout
|
||
|
|
The recent posts section MUST maintain consistency with the existing site design and remain responsive.
|
||
|
|
|
||
|
|
#### Scenario: Section styling matches site design
|
||
|
|
**Given** the recent posts section is displayed
|
||
|
|
**Then** it uses Bootstrap classes consistent with the rest of the site
|
||
|
|
**And** spacing and typography match existing content sections
|
||
|
|
**And** the section is visually distinct from the description section above
|
||
|
|
|
||
|
|
#### Scenario: Responsive layout on mobile devices
|
||
|
|
**Given** the homepage is viewed on a mobile device (< 768px width)
|
||
|
|
**When** the recent posts section is displayed
|
||
|
|
**Then** the layout remains readable and properly formatted
|
||
|
|
**And** no horizontal scrolling is required
|
||
|
|
**And** links are easily tappable
|
||
|
|
|
||
|
|
### Requirement: Performance and Build
|
||
|
|
The implementation MUST not negatively impact Hugo build performance or site load times.
|
||
|
|
|
||
|
|
#### Scenario: Hugo build completes successfully
|
||
|
|
**Given** the homepage template includes recent posts query
|
||
|
|
**When** running `hugo build`
|
||
|
|
**Then** the build completes without errors or warnings
|
||
|
|
**And** the homepage HTML is generated correctly for both languages
|
||
|
|
|
||
|
|
#### Scenario: Site performance remains optimal
|
||
|
|
**Given** the homepage includes recent posts section
|
||
|
|
**When** measuring page load performance
|
||
|
|
**Then** Lighthouse performance score remains >90
|
||
|
|
**And** no additional HTTP requests are made
|
||
|
|
**And** HTML file size increase is minimal (< 2KB)
|