Replace milestone cards with MCap progress chart (#1035)

[realproject7]

Summary

• Replaces the 4 static milestone cards with an SVG area chart visualizing MCap progress from $0 → $100M
• Accent gradient fill from 0 up to current MCap position
• Heartbeat animated dot (Tailwind animate-ping) at current MCap
• 4 vertical dashed milestone markers at $1M/$10M/$50M/$100M
• Desktop: inline labels above chart with MCap value, unlock %, CMC rank
• Mobile: letter markers (A/B/C/D) on chart + 2-column legend grid below
• Font sizes meet minimum: 14px for MCap values and unlock %, 12px for CMC rank
• Linear scale, responsive to container width

Closes #1035

Test plan

• SVG area chart renders with linear scale 0 → $100M
• Filled area visible up to current MCap with accent gradient
• Heartbeat animated dot pulses at current position
• 4 vertical milestone markers with dashed lines
• Desktop: labels inline above chart (MCap, unlock %, CMC rank)
• Mobile: letter markers on chart + legend grid below
• Font sizes readable on mobile (≥14px for key values)
• Chart scales responsively to container width
• No layout breakage

🤖 Generated with Claude Code

[vercel]

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

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
plotlink	Ignored		May 4, 2026 4:26am

[realproject7]

RE2 Verdict: APPROVE

Summary

Well-implemented replacement of milestone cards with an SVG MCap progress chart. All acceptance criteria met.

Findings

• [ok] SVG area chart with linear scale $0 → $100M, preserveAspectRatio="none", responsive via w-full.
• [ok] Accent gradient fill (#00ff88 at 40% → 5% opacity) up to current MCap.
• [ok] Heartbeat dot with Tailwind animate-ping at current position.
• [ok] 4 vertical dashed milestone markers at correct positions ($1M/$10M/$50M/$100M).
• [ok] Desktop: inline labels above chart with MCap, unlock %, CMC rank — hidden on mobile via hidden sm:block.
• [ok] Mobile: letter markers (A/B/C/D) on chart via sm:hidden SVG text + 2-col legend grid below.
• [ok] Font sizes: text-sm (14px) for MCap/unlock%, text-xs (12px) for CMC rank — meets minimum.
• [ok] Good accessibility: role="img" and aria-label on SVG.
• [ok] Version bump 1.5.0 → 1.6.0 correct for feature.
• [ok] CI green, mergeable.
• [nit] Heartbeat dot overlay uses -mt-[52px] magic number — fragile but works since SVG viewBox is fixed. Not blocking.

Decision

Approve. LGTM.

[project7-interns]

Verdict: APPROVE

Summary

The PR implements issue #1035 cleanly: milestone cards are replaced with a responsive SVG MCap progress chart using a linear $0 → $100M scale, gradient fill, current-position heartbeat dot, milestone markers, desktop labels, and mobile legend.

Findings

• [ok] SVG chart uses a linear $0 → $100M scale with filled accent-gradient progress up to current MCap.
  • File: src/components/airdrop/CampaignHero.tsx
• [ok] Current MCap heartbeat dot and milestone dashed markers are present at the expected positions.
  • File: src/components/airdrop/CampaignHero.tsx
• [ok] Desktop labels and mobile A/B/C/D legend cover MCap, unlock %, and CMC rank with readable font sizes.
  • File: src/components/airdrop/CampaignHero.tsx
• [ok] Branch is mergeable and checks passed: lint-and-typecheck, e2e, Vercel.
  • File: PR checks
• [nit] The heartbeat dot overlay uses a fixed negative margin, which is somewhat fragile but acceptable with the fixed SVG height.
  • File: src/components/airdrop/CampaignHero.tsx

Decision

Approve. The change is focused, matches #1035 acceptance criteria, and passes CI.