Tooltip positioning:
- Scrapped SVG-edge priority; now places in opposite vertical half anchored
1rem from the centreline (lower edge above CL if item in bottom half,
upper edge below CL if item in top half)
- Horizontal: left edge aligns with item when item is left of centre;
right edge aligns with item when right of centre
- Clamped to svgRect bounds (not window.inner*)
Click-outside fix:
- Added event.stopPropagation() to D3 v7 planet and element click handlers
- Removed svgNode.contains() guard from _attachOutsideClick so clicks on
empty wheel areas (zodiac ring, background) now correctly dismiss the tooltip
FT fix: use execute_script click for element-ring slice (inside overflow-masked applet)
Jasmine: positioning describe block xdescribe'd (JSDOM has no layout engine)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- _computeConjunctions(planets, threshold=8) detects conjunct pairs
- Tick lines (nw-planet-tick) radiate from each planet circle outward
past the zodiac ring; animated via attrTween; styled with --pri* colours
- planetEl.raise() on mouseover puts hovered planet on top in SVG z-order
- Dual tooltip: hovering a conjunct planet shows #id_natus_tooltip_2 beside
the primary, populated with the hidden partner's sign/degree/retrograde data
- #id_natus_tooltip_2 added to home.html, sky.html, room.html
- _natus.scss: tick line rules + both tooltip IDs share all selectors;
#id_natus_confirm gets position:relative/z-index:1 to fix click intercept
- NatusWheelSpec.js: T7 (tick extends past zodiac), T8 (raise to front),
T9j (conjunction dual tooltip) in new conjunction describe block
- FT T3 trimmed to element-ring hover only; planet/conjunction hover
delegated to Jasmine (ActionChains planet-circle hover unreliable in Firefox)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Move #id_natus_tooltip out of #id_applets_container (container-type:
inline-size breaks position:fixed) → add to home.html alongside
#id_tooltip_portal
- Move #id_natus_tooltip out of .natus-modal-wrap (transform breaks
position:fixed) → place as sibling of .natus-overlay in room.html
- Add _positionTooltip() helper in natus-wheel.js: flips tooltip to
left of cursor when it would overflow right edge; clamps both axes
- Replace hardcoded 280px in dashboard.js palette tooltip with measured
offsetWidth; add left-edge floor (Math.max margin)
- Planet tooltip format: @14.0° Capricorn (<svg-icon>) using preloaded
_signPaths; falls back to unicode symbol if not yet loaded
- Add .tt-sign-icon SCSS: fill:currentColor, vertical-align:middle
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- sky_view passes page_class="page-sky" so the footer pins correctly
- _natus.scss: page-sky aperture block (mirrors page-wallet pattern);
sky-page stacks wheel above form via flex order + page-level scroll;
wheel col uses aspect-ratio:1/1 so it takes natural square size without
compressing to fit the form
- natus-wheel.js: _layout() sets viewBox + preserveAspectRatio="xMidYMid meet"
so the wheel is always centred inside the SVG element regardless of its
aspect ratio (fixes left-alignment in the dashboard applet)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- New _tooltips.scss: .token-tooltip/.tt base block extracted from _wallet-tokens.scss
- core.scss: import order …billboard → tooltips → game-kit → wallet-tokens
- _natus.scss: .tt-title--au/ag/…/pu (--six* dark, --pri* light) + .tt-title--el-* for element ring (--pri* dark, --ter* light) via body[class*="-light"] selector
- natus-wheel.js: element tooltip title switched from inline style to .tt-title--el-{key} CSS class; PLANET_ELEMENTS map drives .tt-title--{el} class on planet titles
- _game-kit.scss: kit bag .tt child font-size rules added (1rem title, 0.75rem desc/shoptalk/expiry)
- CLAUDE.md: SCSS import order updated
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- natus-wheel.js: per-planet <g> group with data-planet/sign/degree/retrograde
attrs; mouseover/mouseout on group (pointer-events:none on child text/℞ so
the whole apparatus triggers hover); tooltip uses .tt-title/.tt-description;
in-sign degree via _inSignDeg() (ecliptic % 30); D3 switched from CDN to
local d3.min.js
- _natus.scss: .nw-planet--hover glow; #id_natus_tooltip position:fixed z-200
- _natus_overlay.html: tooltip div uses .tt; local d3.min.js script tag
- T3/T4/T5 converted from Selenium execute_script to Jasmine unit tests
(NatusWheelSpec.js) — NatusWheel was never defined in headless GeckoDriver;
SpecRunner.html updated to load D3 + natus-wheel.js
- test_pick_sky.py: NatusWheelTooltipTest removed (replaced by Jasmine)
- test_component_cards_tarot / test_trinket_carte_blanche: equip assertions
updated from legacy .equip-deck-btn/.equip-trinket-btn mini-tooltip pattern
to current DON|DOFF (.btn-equip in main portal); mini-portal text assertions
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Replace Unicode glyph text elements with inline SVG <path> icons loaded from icons/zodiac-signs/*.svg files
- NatusWheel.preload() fetches + caches all 12 zodiac SVG paths before first draw; auto-detects static base URL from <script src>
- Per-element (fire/stone/air/water) colored circles behind zodiac icons; icon fill colors use element palette vars
- PLANET_ELEMENTS map (au/ag/hg/cu/fe/sn/pb/u/np/pu) drives per-planet circle + label CSS modifier classes
- Planet circles: ternary fill + senary stroke per alchemical metal palette; labels: senary fill + stroke halo
- Zodiac icon scale = 85% of circle diameter (15% inset so icons breathe inside circles)
- Zodiac + house segment bg opacity 0.5; all ring/segment borders --terUser
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Fix D3 arc coordinate offset (add π/2 to all arc angles — D3 subtracts it
internally, causing fills to render 90° CW from label midpoints)
- Fix house-12 wrap-around: normalise nextCusp += 360 when it crosses 0°,
eliminating the 330° ghost arc that buried house fill/number layers
- Draw all house fills before cusp lines + numbers (z-order fix)
- SCSS: sign/element fills corrected to rgba(var(--priXx, R, G, B), α) —
CSS vars are raw RGB tuples so bare var() in fill was invalid
- brighten Stone/Air/Water fallback colours; raise house fill opacities
- Button layout: SAVE SKY moves into form column (full-width, pinned bottom);
NVM becomes a btn-sm circle anchored on the modal's top-right corner via
.natus-modal-wrap (position:relative, outside overflow:hidden modal);
entrance animation moved to wrapper so NVM rides the fade+slide
- Form fields wrapped in .natus-form-main (scrollable); portrait layout
switches form-col to flex-row so form spans most width, SAVE SKY on right
- Modal max-height 92→96vh, max-width 840→920px, SVG cap 400→480px
- FT: PickSkyLocalStorageTest (2 tests) — form fields restored after NVM
and after page refresh
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>