Fix hero image rendering in slide mode

[thanghp94]

Description

This PR fixes hero image rendering issues in slide mode for the website template.

Changes

• Restructured HighImpactHero component to position background image absolutely within parent container
• Restructured PostHero component with the same fix for consistent image rendering
• Moved min-h-[80vh] to parent containers for proper height
• Images now display correctly in both normal and slide modes

Problem

Hero images were not displaying in slide mode because they were structured as sibling elements rather than being absolutely positioned within their parent containers. When slide mode wrapped the hero in additional divs, the positioning context changed, preventing images from displaying properly.

Solution

Repositioned the background images to be absolutely positioned children of the main container, ensuring they render correctly regardless of wrapper div structure.

Testing

• Hero images now render in both normal mode and slide mode (?mode=slides)
• Responsive behavior maintained across different screen sizes

[github-actions]

Pull Request titles must follow the Conventional Commits specification and have valid scopes.

No release type found in pull request title "Fix hero image rendering in slide mode". Add a prefix to indicate what kind of release this pull request corresponds to. For reference, see https://www.conventionalcommits.org/

Available types:

• build
• chore
• ci
• docs
• examples
• feat
• fix
• perf
• refactor
• revert
• style
• templates
• test

feat(ui): add Button component
^    ^    ^
|    |    |__ Subject
|    |_______ Scope
|____________ Type