This xhosi template represents the consolidation of three existing Eleventy websites, extracting their best practices while eliminating technical debt.
Project Goals
The main objectives were to:
- Reduce CSS complexity from 1000+ lines to ~800 lines across modular files
- Standardize dependencies with the latest stable versions
- Implement clean theming without CSS specificity battles
- Create maintainable architecture for future development
- Preserve essential features from all source websites
Source Analysis
xhosi analyzed three source websites:
- pborenstein.com: Advanced features but high technical debt
- pborenstein.dev: Clean implementation, used as foundation
- plywoodviolin.com: Minimal but complete basic features
Architecture Decisions
CSS Strategy
The modular CSS approach provides clear separation of concerns while maintaining small file sizes and easy maintenance.
Theme Implementation
Clean light/dark/system preference support without the CSS specificity issues found in the source websites.
JavaScript Approach
Minimal, focused JavaScript for essential features like theme switching, with progressive enhancement principles.
Build Pipeline
Modern Eleventy configuration with image optimization, RSS generation, and development-friendly features.
Development Workflow
The project supports specialized agent workflows for maintenance:
- CSS Agent: Stylesheet optimization and theming
- Content Agent: Post and page management
- Build Agent: Technical pipeline maintenance
- Theme Agent: Visual consistency and design system
This approach ensures long-term maintainability and systematic improvements.