The header is the first thing a user sees. A short staggered fade-in (logo → title → action button → right-side icons over ~360ms) turns the instant-pop-in feel into a subtle "the tool is composing itself" beat. Pure CSS @keyframes (no JS), cubic-bezier(0.2, 0.7, 0.2, 1) for the "settle in" easing curve. Respects prefers-reduced-motion. Total budget ~260ms before everything is visible — well under the threshold where it becomes a perceptible delay. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| fonts | ||
| vendor | ||
| base.css | ||
| build-lib.sh | ||
| build-words.txt | ||
| favicon.svg | ||
| fonts.css | ||
| hash.js | ||
| help.js | ||
| logo.css | ||
| logo.js | ||
| nav.css | ||
| nav.js | ||
| preview-lib.js | ||
| theme.js | ||
| toast.css | ||
| toast.js | ||
| zddc-filter-test.html | ||
| zddc-filter.js | ||
| zddc-source.js | ||
| zddc-test.html | ||
| zddc.js | ||