fix(Tooltip): raise tooltips above the navbar, modals and dropdowns

[sukvvon]

Hovering the Ask AI button in the navbar produced a tooltip whose top edge was clipped by the navbar itself.

The tooltip opens side="bottom", so it starts 55px down — inside the navbar's 0–58px band. The navbar is z-[100] and the tooltip was z-50, so the navbar won the overlap.

Why 1300

The repo has no declared z-index scale, so the layers were read off the code:

layer	z-index
dropdown	1200
modal	1000 / 999
navbar	100
tooltip	50

Every layer follows the usual ordering except the tooltip, which sat 24× below the dropdown it is supposed to annotate. Bootstrap, Chakra and MUI all place tooltips at or near the top of the stack for the same reason: a tooltip explains another control, so nothing should cover it.

z-[1300] puts it above the dropdown, which is the highest ordinary layer here.

Both tooltip implementations carried z-50 and both are fixed — ~/ui/Tooltip (5 consumers) and ~/components/Tooltip (8 consumers, npm-stats).

Verified in the browser

Measured rather than eyeballed, since the overlap is only a few pixels:

tooltip   top 55 → bottom 87   z-index 1300
navbar    top  0 → bottom 58   z-index 100

document.elementFromPoint at (1035, 57) — a point inside the overlap — now returns the tooltip. Before the change it returned the navbar.

tsc, oxlint and the 142 unit tests pass.

Screenshot

AS-IS

TO-BE

Summary by CodeRabbit

• Bug Fixes
  • Improved tooltip layering so tooltips appear above other interface elements and remain visible when overlapping content.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 29590d8c-1df7-4af9-bb04-98931949ed6a

📥 Commits

Reviewing files that changed from the base of the PR and between 152723f and 7e9c1e2.

📒 Files selected for processing (2)

• src/components/Tooltip.tsx
• src/ui/Tooltip.tsx

🚧 Files skipped from review as they are similar to previous changes (2)

• src/components/Tooltip.tsx
• src/ui/Tooltip.tsx

---

📝 Walkthrough

Walkthrough

Both tooltip implementations change their stacking order class from z-50 to z-1300. No public declarations or other behavior changes.

Changes

Tooltip stacking order

Layer / File(s)	Summary
Update tooltip stacking classes src/components/Tooltip.tsx, src/ui/Tooltip.tsx	The tooltip container and content now use z-1300 instead of z-50.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Merge Risk: ⚪ Minimal · up to 7e9c1

This localized styling change raises tooltip layering above existing navigation, modal, and dropdown layers; no actionable merge-blocking risk remains after normal checks and review.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly describes the main change: increasing tooltip stacking order above navigation, modals, and dropdowns.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/tooltip-above-navbar

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	tanstack-com	7e9c1e2	Commit Preview URL Branch Preview URL	Aug 14 2026, 06:27 PM