Skip to content

feat(landing): replace features section with capability-timeline scru…#5

Merged
shashank03-dev merged 1 commit into
mainfrom
feat/capability-timeline
Jun 28, 2026
Merged

feat(landing): replace features section with capability-timeline scru…#5
shashank03-dev merged 1 commit into
mainfrom
feat/capability-timeline

Conversation

@shashank03-dev

Copy link
Copy Markdown
Owner

…bber

Remove the pinned left-list / right-panel crossfade "Everything you need to ship motion" section and rebuild it as a motion-editor timeline: a fixed read-head with the capability cards sliding horizontally under it on scroll, each playing its own signature visualization (frame strip, easing curve draw, export bars, render-score gauge, accessibility checks).

  • New self-contained CapabilityTimeline component (dynamic-imported), GSAP ScrollTrigger pin + scrub, gsap.matchMedia for desktop / mobile / reduced motion. Defaults render every viz in its finished state so it reads with no JS and under prefers-reduced-motion.
  • Vendor React Bits DecryptedText for card titles (import adapted to the project's framer-motion).
  • Colors follow the brand system: sand (#D8CFBC) accent for the visualizations, neon green (#00FF88) reserved for live signals only (read-head, active tick, live node, active dot).
  • Keep id="features" for the nav anchor; drop the old feature CSS/JS from page.tsx and globals.css; update the two affected marketing e2e tests.

…bber

Remove the pinned left-list / right-panel crossfade "Everything you need
to ship motion" section and rebuild it as a motion-editor timeline: a fixed
read-head with the capability cards sliding horizontally under it on scroll,
each playing its own signature visualization (frame strip, easing curve draw,
export bars, render-score gauge, accessibility checks).

- New self-contained CapabilityTimeline component (dynamic-imported), GSAP
  ScrollTrigger pin + scrub, gsap.matchMedia for desktop / mobile / reduced
  motion. Defaults render every viz in its finished state so it reads with no
  JS and under prefers-reduced-motion.
- Vendor React Bits DecryptedText for card titles (import adapted to the
  project's framer-motion).
- Colors follow the brand system: sand (#D8CFBC) accent for the visualizations,
  neon green (#00FF88) reserved for live signals only (read-head, active tick,
  live node, active dot).
- Keep id="features" for the nav anchor; drop the old feature CSS/JS from
  page.tsx and globals.css; update the two affected marketing e2e tests.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@vercel

vercel Bot commented Jun 28, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
motion-code Ready Ready Preview, Comment Jun 28, 2026 5:30pm

@shashank03-dev
shashank03-dev merged commit 6af2677 into main Jun 28, 2026
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants