Operator feedback after PR #110: "remove the shading around the
hover that makes it feel like it's floating" + "the gradient is a
little too bold." Two surgical changes to styles/globals.css.
1. Dropped the base background-color tint on .nav-item:hover /
.nav-item-bottom:hover / .nav-item-hover:hover (and the matching
focus-within selectors, light + dark variants). With the rectangle
tint gone, the item no longer reads as a floating chip against
the sidebar — only the mouse-tracking radial spotlight remains
on hover, which reads as light pooling under the cursor rather
than a state-color block. The color: var(--text-primary) shift
stays as the secondary affordance + for label AA contrast.
2. Toned down the radial-gradient alphas in the ::before:
- Light center: 0.35 → 0.22 (-37%)
- Light midpoint: 0.18 → 0.10 (-44%)
- Dark center: 0.40 → 0.26 (-35%)
- Dark midpoint: 0.22 → 0.12 (-45%)
Same 120px radius, same shape, gentler glow.
Tests:
- npm run test:run: 113/113
- npm run lint: clean (1 pre-existing unused-disable warning)
- npm run build: green
Co-authored-by: Cursor <cursoragent@cursor.com>
c2c4d869a1