Skip to content

Airdrop hero: redesign milestone cards — prod values, icons, CMC rank, top placement #1027

@realproject7

Description

@realproject7

Changes

Move the milestone cards section to the top of the hero (right below headline + countdown), and redesign:

1. Use prod milestone values

Cards currently show test values ($7K/$10K/$35K/$50K). Always show prod values in the cards regardless of mode:

  • $1M / $10M / $50M / $100M

2. Add status icons (top-left corner of each card)

  • Reached milestone: green checkmark ✅
  • Not yet reached: pending/dimmed circle ○

3. Add CMC ranking

Each card shows approximate CMC ranking below the MCap target:

4. Card content

Each card:
```
[✅ or ○]
$1M
≈ CMC #1900
unlocks
10%
```

Wireframe

```
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
│○ │ │○ │ │○ │ │○ │
│ $1M │ │ $10M │ │ $50M │ │ $100M │
│ ≈#1900 │ │ ≈#950 │ │ ≈#400 │ │ ≈#250
│ unlocks │ │ unlocks │ │ unlocks │ │ unlocks │
│ 10% │ │ 30% │ │ 50% │ │ 100% │
└──────────┘ └──────────┘ └──────────┘ └──────────┘


### Placement
Directly below the headline/countdown, **above** other sections.

## Files
- \`src/components/airdrop/CampaignHero.tsx\`

## Acceptance Criteria
- [ ] Cards show \$1M / \$10M / \$50M / \$100M (prod values)
- [ ] Status icon: checkmark (reached) or circle (pending) on each card
- [ ] CMC rank shown on each card
- [ ] Cards placed at top of hero below headline
- [ ] Responsive: 4-col desktop, 2×2 mobile

Metadata

Metadata

Assignees

No one assigned

    Labels

    agent/T3Assigned to T3 builder agent

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions