Skip to content

Components

Reusable React components organized by domain.

Layout

  • BackNav - Route-aware breadcrumb navigation
  • BottomNav - Bottom navigation bar (detects active note slug for chatbot context)
  • CommandPalette - Keyboard shortcut palette
  • ThemeProvider - Custom theme context (light/dark/custom)

Content

  • NoteList - Blog post listing with view counts
  • ArticlePage - Full article renderer
  • TableOfContents - Auto-generated TOC from h2/h3 headings (fixed sidebar on desktop, inline collapsible on mobile)
  • RelatedArticles - Related post suggestions
  • ProjectList - Project cards with filter bar

Home

  • SpotifySection - Now playing / recently played tracks from Spotify (used on home and about pages)
  • VscoGallery - Infinite scroll VSCO gallery
  • FeaturedGallery - Curated homepage gallery

UI

  • UniversalImage - Image with placeholder fallback
  • ImagePreview - Hover preview portal
  • Table - Enhanced MDX table
  • YouTubeEmbed - Responsive video embed

OG Image

  • OGLayout - Server-rendered OG image layout
  • TextElement - Styled text for OG images
  • ImageElement - Image with fallback for OG images

Icons

  • ProjectIcon - Renders image, emoji, or SVG component icons