staccato-hugo 2026-01-28
Initial release of staccato-hugo theme
132 files · 35,499+

TypeScript effect system

instantiate behavioral
6 files changed
  • BaseEffect.ts Abstract base class with lifecycle and canvas management
  • EffectManager.ts Effect registry and switcher
  • EffectUI.ts UI controls for effect selection and configuration
  • PolyCentriCityEffect.ts Primary effect: 2570-line polycentric city network simulation
  • ConstellationEffect.ts Constellation star-field effect
  • StarfieldEffect.ts 3D starfield with Three.js
  • Six canvas effects: PolyCentriCity (polycentric city network), Constellation, GeometricMesh, NoiseField, ParticleWave, and Starfield. BaseEffect provides lifecycle hooks (init/render/resize/destroy), EffectManager handles switching, EffectUI exposes controls. Full test coverage: 6 effect test suites plus polycentric sub-tests (network, trails). Storybook stories for each effect. instantiate behavioral
    3 files
    • BaseEffect.ts
    • EffectManager.ts
    • PolyCentriCityEffect.ts

Hugo layouts, partials, and shortcodes

instantiate behavioral
6 files changed
  • baseof.html Base template with settings drawer, search modal, analytics
  • single.html Post single template with TOC, breadcrumbs, schema
  • settings-drawer.html Settings drawer: theme, typography, effects controls
  • analytics.html Analytics partial (privacy-respecting)
  • callout.html Callout shortcode
  • playground.html Interactive playground shortcode
  • Full Hugo layout hierarchy: baseof, list, single, posts/single, projects/list, sitemap. Partials cover header, footer, breadcrumbs, search modal, settings drawer, analytics, social share, schema (Article, BreadcrumbList, Organization, Website), staccato-beats, post-item. Shortcodes: callout, figure, img, playground. instantiate behavioral
    2 files
    • baseof.html
    • settings-drawer.html

CSS component library

instantiate behavioral
4 files changed
  • base.css Base reset and custom properties
  • dirlist.css Directory listing component with pulse animations
  • themes.css Light/dark theme variables
  • syntax.css Code syntax highlighting (601 lines)
  • 20+ CSS component files: base, themes, layouts, dirlist, syntax, playground, and components/ subtree covering breadcrumbs, callouts, code-blocks, comments, dropdowns, focus-mode, footer, header, lightbox, newsletter, posts, previews, projects, reading-progress, related-posts, responsive, search, settings-drawer, social-share, terminal, toast, TOC, typography-controls, utilities. instantiate behavioral
    2 files
    • themes.css
    • dirlist.css

Search, theme switcher, and utility TypeScript

instantiate behavioral
5 files changed
  • search.ts Fuzzy search with Fuse.js and keyboard navigation
  • theme-switcher.ts Theme and typography control panel (1305 lines)
  • main.ts Entry point: search, TOC, settings drawer initialization
  • dirlist.ts Directory listing JS
  • toc.ts Table of contents scroll tracking
  • Search: Fuse.js fuzzy search with keyboard navigation (335 lines, 635-line test suite). Theme switcher: light/dark/custom themes with font family/size/weight/line-height sliders stored to localStorage (1305 lines). main.ts bootstraps all components on DOMContentLoaded. TOC scroll-spy. Toast notifications. instantiate behavioral
    2 files
    • search.ts
    • theme-switcher.ts
changelog → 2026-01-29 staccato-hugo →