4
Glassmorphism header, animated signature, and homepage polish
v1.0.3Mar 29, 2026 · 17:06
new
- —session: glassmorphism header, animated signature, homepage + changelog polish
Headshot hover, About & Contact pages, homepage depth
v1.0.2Mar 28, 2026 · 00:00
newdesignagent
- —Built /about page with personal story, 4 How I Work principles, Toolkit grid, Experience timeline, and Currently section
- —Built /contact page with availability badges, service cards, contact form with success state, and FAQ
- —Added avatar hover interaction on hero — cursor icon fades out as headshot photo fades and scales in
- —Extracted CursorIconSkeuo and CursorAvatar to shared component; added iconOffset prop for per-instance optical centering
- —Added "Now" section to homepage (building/learning/reading/thinking rows)
- —Added "Writing" section to homepage with 3 article teasers ready for real content
- —Simplified header: removed ⌘K search, nav text-xs for better pill proportion, theme toggle stays right
Design note
The CursorAvatar iconOffset prop solves a recurring problem — optical centering differs by size. The hero needs 2px, the 28px header slot only needs 1px. Making it a prop keeps the component honest rather than hard-coding a compromise.
Changelog page, floating header, and build pipeline
v1.0.1Mar 27, 2026 · 00:00
newdesign
- —Changelog page built at /changelog — server component reads index.json, client component handles filtering and staggered animations
- —Every changelog entry card gets a permanent CardFooter strip for version, date, tags, and source metadata
- —Changelog build pipeline wired up — prebuild hook runs changelog:build before every next build automatically
- —Draft script updated to auto-generate entry titles from commit messages
- —CLAUDE.md created — documents design system tokens, card patterns, and hands-off changelog workflow
- —Header converted to floating pill with borderRadius 300px, surface fill, and double-ring outline
- —Scroll-triggered avatar added to header — slides in after 20px scroll, links back to home on click
- —Fixed Framer Motion v12 type conflicts in Button, page.tsx, and design-system page
Design note
The header was redesigned from a full-width sticky bar to a floating pill. Centering it with the same max-w-[640px] mx-auto px-6 wrapper as the page content — rather than a flex justify-center approach — is what keeps it from extending beyond the content column on wide screens. The double-ring treatment (border-strong + outline at outlineOffset 2px) matches the IconBadge chrome, making the header feel like a first-class design system element.
Initial portfolio foundation
v1.0.0Mar 27, 2025 · 00:00
new
- —Next.js + TypeScript project scaffolded with App Router
- —Design system page created at /design-system
- —Core UI component library built: Avatar, Badge, Button, Card, CodeBlock, IconBadge, Input, Separator, Tag, ThemeToggle, Toggle
- —Header component implemented with sticky nav, ⌘K trigger, and theme toggle
- —Global styles, design tokens, and layout established — light and dark mode
- —Homepage built with hero, featured projects, newsletter, and footer sections
- —Changelog infrastructure scaffolded — platform + per-project surfaces