From 2222d8a5fac6850d7d924e9404a44a65cb10f68f Mon Sep 17 00:00:00 2001 From: Tyler Hoang Date: Thu, 21 May 2026 14:49:56 -0700 Subject: fix: rewrite polar smile with correct closed-lens geometry MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Piecewise angleFor: puts go CCW (ATM→bottom), calls go CW (ATM→bottom) so both wings meet at the same bottom point and the path closes with Z - Dynamic ivToR computed from actual IV range across all expiries (inner floor 60px, outer wall 240px) instead of hardcoded percentages - IV rings: 5 evenly-spaced steps between real ivLo/ivHi - Curve fill: rgba(194,170,122,0.12) matching design reference - Non-selected curves: index-based styles (solid fg-1, then dashed fg-2/3/4) - Eye price at font-size 30, label lowercase 'call · fair' - Dashed marker-line spoke from center to selected-K dot - Clicking a curve switches the selected expiry via onPickT - Strike ticks use round multiples of a price-adaptive step - Fix IvHeatmap xlabs duplicate key error (key by index, not rounded K) Co-Authored-By: Claude Sonnet 4.6 --- frontend/app/options.css | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) (limited to 'frontend/app/options.css') diff --git a/frontend/app/options.css b/frontend/app/options.css index 4055041..2841932 100644 --- a/frontend/app/options.css +++ b/frontend/app/options.css @@ -456,9 +456,19 @@ .opt-polar text.tick.atm { fill: var(--brass-bright); font-weight: 500; } .opt-polar text.iv { font-family: var(--font-mono); font-size: 9px; fill: var(--fg-4); letter-spacing: 0.04em; } .opt-polar .eye { fill: var(--ink-0); stroke: var(--brass); stroke-width: 1; } -.opt-polar text.eye-lbl { font-family: var(--font-sans); font-size: 9px; fill: var(--fg-3); text-transform: uppercase; letter-spacing: var(--tr-wider); } -.opt-polar text.eye-num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; fill: var(--brass-bright); font-weight: 500; } +.opt-polar text.eye-lbl { + font-family: var(--font-sans); font-size: 9px; + fill: var(--fg-3); text-transform: uppercase; letter-spacing: var(--tr-wider); +} +.opt-polar text.eye-num { + font-family: var(--font-mono); font-variant-numeric: tabular-nums; + fill: var(--brass-bright); font-weight: 500; +} .opt-polar .dot { fill: var(--brass-bright); stroke: var(--ink-0); stroke-width: 2; } +/* Dashed spoke from center to selected-K dot */ +.opt-polar .marker-line { stroke: var(--brass); stroke-width: 1; stroke-dasharray: 3 3; } +/* K label and general brass text */ +.opt-polar text.brass { fill: var(--brass-bright); font-family: var(--font-mono); font-variant-numeric: tabular-nums; } .opt-surface-legend { display: flex; gap: var(--sp-3); align-items: center; flex-wrap: wrap; -- cgit v1.3-2-g0d8e