Markus GrafandClaude
d36a18d28b
Initialize minimal Hugo site structure with Bootstrap 5.3.2 integration for markusgraf.ch conversion. Implements OpenSpec proposal add-minimal-hugo-site. Features: - Hugo project structure with standard directories - Base layout template (baseof.html) with Bootstrap 5.3.2 via CDN - Homepage (index.html) and single page (single.html) templates - Reusable partials: header, footer, navigation - Responsive Bootstrap grid layout - Mobile-first design with semantic HTML5 - Valid HTML output with basic accessibility features - Taxonomies disabled for minimal site (see docs/TAXONOMIES.md) Documentation: - IMPLEMENTATION_SUMMARY.md - Complete implementation guide - docs/TAXONOMIES.md - Guide for re-enabling categories/tags - static/README.md - Guide for placing static assets Configuration: - hugo.toml configured for markusgraf.ch - .gitignore for Hugo build artifacts All 24 tasks from OpenSpec proposal completed successfully. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
5.2 KiB
ADDED Requirements
Requirement: Hugo Project Structure
The system SHALL initialize a Hugo static site with the standard directory structure including layouts, content, static, and data directories.
Scenario: Hugo site initialized
- WHEN Hugo site is created
- THEN the following directories exist: layouts/, content/, static/, data/
- AND a hugo.toml configuration file is present at the root
Scenario: Hugo builds successfully
- WHEN running
hugocommand - THEN the site builds without errors
- AND generates static HTML files in the public/ directory
Requirement: Base Layout Template
The system SHALL provide a baseof.html template that defines the common HTML structure for all pages, including Bootstrap 5.x integration.
Scenario: Base layout includes Bootstrap
- WHEN any page is rendered
- THEN the HTML output includes Bootstrap 5.x CSS from CDN
- AND the page has proper HTML5 doctype and meta tags
- AND the page is responsive with Bootstrap's viewport meta tag
Scenario: Base layout includes header and footer
- WHEN any page is rendered
- THEN the page includes the header partial
- AND the page includes the footer partial
- AND the main content block is properly positioned between them
Requirement: Reusable Partials
The system SHALL provide reusable partial templates for header, footer, and navigation components.
Scenario: Header partial exists
- WHEN baseof.html calls the header partial
- THEN the header is rendered with consistent styling across all pages
Scenario: Footer partial exists
- WHEN baseof.html calls the footer partial
- THEN the footer is rendered with consistent styling across all pages
Scenario: Navigation partial exists
- WHEN header includes navigation
- THEN the navigation menu renders with links to main pages
- AND uses Bootstrap navigation components
Requirement: Homepage Template
The system SHALL provide an index.html template for the homepage that extends baseof.html and displays the main landing content.
Scenario: Homepage renders correctly
- WHEN accessing the root URL
- THEN the homepage template is used
- AND displays content from content/_index.md
- AND matches the structure of the existing markusgraf.ch homepage
Requirement: Single Page Template
The system SHALL provide a default single.html template for individual content pages.
Scenario: Single page renders correctly
- WHEN accessing any content page
- THEN the single page template is used
- AND displays the page title
- AND renders the markdown content as HTML
Requirement: Static Assets
The system SHALL serve static assets (images, fonts, CSS files) from the static/ directory.
Scenario: Static files are accessible
- WHEN a static file is placed in static/
- THEN it is accessible at the site root in the built site
- AND preserves the directory structure from static/
Requirement: Content Management
The system SHALL support markdown files in the content/ directory that are rendered into HTML pages.
Scenario: Markdown content is rendered
- WHEN a markdown file exists in content/
- THEN Hugo processes it into an HTML page
- AND front matter variables are accessible in templates
Scenario: Page metadata
- WHEN a content file has front matter
- THEN title, date, and other metadata are available in templates
- AND can be used for page titles and navigation
Requirement: Configuration
The system SHALL use hugo.toml for site configuration including baseURL, title, and language settings.
Scenario: Site configuration is applied
- WHEN hugo.toml contains site settings
- THEN those settings are used during site generation
- AND site title appears in page titles
- AND baseURL is used for absolute URLs
Requirement: Responsive Design
The system SHALL render pages that are responsive and mobile-friendly using Bootstrap's grid system and responsive utilities.
Scenario: Mobile viewport
- WHEN viewing the site on mobile devices
- THEN the layout adapts to small screens
- AND navigation is accessible
- AND content is readable without horizontal scrolling
Scenario: Tablet and desktop viewports
- WHEN viewing the site on larger screens
- THEN the layout utilizes available space appropriately
- AND maintains readability and visual hierarchy
Requirement: HTML Validity
The system SHALL generate valid HTML5 markup that passes standard validation.
Scenario: Valid HTML output
- WHEN pages are generated
- THEN HTML is well-formed
- AND includes required DOCTYPE and meta tags
- AND uses semantic HTML5 elements where appropriate
Requirement: Accessibility Basics
The system SHALL implement basic accessibility features including semantic HTML and proper heading hierarchy.
Scenario: Semantic HTML structure
- WHEN pages are rendered
- THEN content uses appropriate semantic elements (header, nav, main, footer, article)
- AND maintains logical heading hierarchy (h1, h2, h3)
Scenario: Navigation accessibility
- WHEN keyboard navigation is used
- THEN all interactive elements are focusable
- AND focus order is logical