Colophon

STACK

• ❯ Framework: Astro 5.16.3
• ❯ Styling: Tailwind CSS v4 with custom @theme tokens
• ❯ Search: Algolia Search for instant content discovery
• ❯ MDX: @astrojs/mdx for enhanced Markdown
• ❯ Build: Vite with HMR and optimizations
• ❯ Package Manager: pnpm for efficient dependency management
• ❯ Site Map: @astrojs/sitemap for SEO
• ❯ Icons: astro-icon for optimized SVG assets

DESIGN

The design is inspired by terminal aesthetics, bringing a developer-focused interface that feels both familiar and modern. The site features a command palette (⌘K) for quick navigation and interaction.

• ❯ Color System: Catppuccin theme (Mocha for dark mode, Latte for light mode)
• ❯ Typography: JetBrains Mono and IBM Plex Mono monospace fonts throughout
• ❯ Command Palette: Instant search, help navigation, and theme switching via keyboard shortcuts
• ❯ Theme Switching: Light/dark mode with localStorage persistence and FOUC prevention
• ❯ Backdrop Effects: backdrop-blur-2xl with gradients and modern transparency
• ❯ Terminal Elements: Prompts, paths, and monospace aesthetic with cursor animations

PERFORMANCE

• ❯ Rendering: Static rendering via Astro (zero JS by default)
• ❯ SVG: SVGO enabled for optimized SVG assets
• ❯ JavaScript: Minimal client-side JS with progressive enhancement approach
• ❯ Build: Vite-powered build with modern ES modules and tree-shaking
• ❯ Search: Debounced search (150ms) to prevent API spam
• ❯ Search Index: Algolia Search integration for instant full-text search
• ❯ Theme: Smooth 200ms transitions between theme changes

ACCESSIBILITY

Accessibility is a core priority. All design decisions are validated against WCAG AAA standards to ensure the site is usable by everyone.

• ❯ Contrast: WCAG 2.1 AAA color contrast compliance (7:1+ for body text)
• ❯ Touch Targets: All interactive elements are minimum 44×44px
• ❯ Keyboard Navigation: Full support throughout with visible focus states
• ❯ Command Palette: Full keyboard support with ↑↓ arrow navigation and Enter to activate
• ❯ HTML: Semantic HTML with proper ARIA labels and landmarks
• ❯ Screen Readers: Screen reader friendly text and descriptions
• ❯ Testing: Automated testing with 100% compliance via axe CLI
• ❯ Motion: Respects prefers-reduced-motion for animations
• ❯ Theme: Respects system settings with manual override option

CONTENT & WORKFLOW

• ❯ Content: Markdown/MDX content with full component support
• ❯ Images: Image optimization via Astro's built-in processing
• ❯ Configuration: Type-safe configuration using TypeScript interfaces

HOSTING & DEPLOYMENT

Deployed as a static site. CDN and caching configured via hosting provider for optimal performance worldwide.

PRIVACY

No invasive tracking. Basic analytics and monitoring may be used to improve the site experience.

CREDITS

• ❯ Creator: Steve McDougall (steve@juststeveking.com)
• ❯ Dependencies: Open-source dependencies credited via package manifests
• ❯ Built With: Care for accessibility, performance, and user experience