[#1061] Airdrop chart polish: inside labels, generic numbering, CMC, smooth curve, font#1062
Merged
realproject7 merged 1 commit intomainfrom May 6, 2026
Merged
Conversation
…smooth curve, font Five fixes per user feedback on the chart from #1060: 1. Move milestone label blocks INSIDE the chart, anchored to the LEFT of each vertical line (text-anchor="end", x = lineX - 6). Each block has 4 lines stacked from top of chart: tier title / $value / unlocks % / CMC ≈ rank. 2. Replace "Bronze/Silver/Gold/Diamond" with "MILESTONE 1/2/3/4" in labels and mobile legend ("M1/M2/M3/M4"). Drop TIER_NAMES map and the redundant bottom tier-name X-axis labels. 3. Add "CMC" prefix to ranks ("CMC ≈ #1900") and append "· CMC = CoinMarketCap" to both footnotes (campaign hero footer and the modal footnote). 4. Replace banded log mcapToX with monotone cubic Hermite using Catmull-Rom slopes in (log10 mcap, X) space. C¹-continuous so the curve has no visible slope discontinuity at any milestone knot, while still passing exactly through the 5 knot points (X positions remain 0/0.25/0.5/0.75/1.0). 5. Apply the project's font system: wrap the SVG in <svg className="font-mono"> so all text inherits Geist Mono per the .font-mono rule in src/app/globals.css. Remove all inline fontFamily="monospace". Mobile legend wrapper also picks up font-mono. Reviewer note: block if labels go back above the chart, tier names return, or curve kink reappears at any milestone knot. Fixes #1061 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #1061
Summary
Five polish fixes from user feedback on the chart shipped in #1060.
CampaignHero.tsxMILESTONE N(M1on mobile); bottom tier-name X-axis labels droppedCampaignHero.tsxCMCprefix; footnote in hero + modal appended with· CMC = CoinMarketCapCampaignHero.tsxmakeMcapToXrewritten as monotone cubic Hermite (Catmull-Rom slopes inlog10 mcap → Xspace) — C¹-smooth at every knot, no more visible kinkCampaignHero.tsxfont-monoto inherit Geist Mono perglobals.css:56-57; all inlinefontFamily="monospace"removedCampaignHero.tsxSmooth-curve math (fix #4)
Old: piecewise log-interp inside each band.
dx/d(log m)constant within band but jumps at knots because each band has different log range (band 0=2dec, band 1=1dec, band 2=0.7dec, band 3=0.3dec). Visible kink at gold→diamond on the live chart.New: monotone cubic Hermite. Slopes at each knot use the Catmull-Rom centered formula
(xs[i+1]-xs[i-1]) / (lms[i+1]-lms[i-1])(one-sided at endpoints). Within segment[lms[i-1], lms[i]], standard cubic Hermite basish00·x0 + h10·dt·m0 + h01·x1 + h11·dt·m1withu = (t-t0)/dt. Passes exactly through all 5 knots (X = 0/0.25/0.5/0.75/1.0), C¹-continuous everywhere, monotonic on our data (slopes are monotonically increasing).Curve renders by sampling 200 MCap points uniformly in log space and connecting with
L. Heartbeat dot uses the samemcapToX, so it lies exactly on the curve.Files
src/components/airdrop/CampaignHero.tsxpackage.json— 1.8.0 → 1.8.1Verification
npm run typecheckpassesnpm run lintclean forCampaignHero.tsxmcapToX($1M) = 0.25,mcapToX($10M) = 0.5,mcapToX($50M) = 0.75,mcapToX($100M) = 1.0(knot exactness)mcapToX($33K) ≈ 0.061(slightly different from old0.065— both put the dot in pre-bronze band)Test plan
MILESTONE N/\$value/unlocks Y%/CMC ≈ #ZMCap = PLOT price × 1M max supply · CMC = CoinMarketCapM1 / M2 / M3 / M4labels