Skip to content

fix(web): make mobile navigation opaque - #20

Merged
Lucalopezz merged 1 commit into
mainfrom
fix/18-mobile-navbar-background
Oct 24, 2026
Merged

Lucalopezz merged 1 commit into
mainfrom
fix/18-mobile-navbar-background

Conversation

@Lucalopezz

Copy link
Copy Markdown
Owner

The mobile menu lets the underlying dashboard show through because its sidebar color tokens are not defined. Give the mobile drawer an opaque theme surface and replace its blurred, faint overlay with 70% black so navigation stays readable.

The styling is scoped to the portaled mobile sidebar and its overlay. Desktop navigation and generated shadcn primitives are unchanged.

Closes #18

Validation

  • TDD: both new browser checks failed before the fix because the drawer background was fully transparent.
  • All 13 browser behavior tests pass, including both themes, menu links, Escape dismissal, and desktop navigation.
  • Web lint, production build, and browser-test TypeScript checks pass. The build retains the existing large-chunk warning.
  • Browser API responses are intercepted; these checks establish frontend behavior.

Screenshots

Opaque dark mobile navigation with a dark overlay and no blur

Opaque light mobile navigation with a dark overlay and no blur

@vercel

vercel Bot commented Oct 24, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
devlog-unified-preview Ready Ready Preview Oct 24, 2026 11:55am UTC

@Lucalopezz
Lucalopezz merged commit 0046598 into main Oct 24, 2026
5 checks passed

This branch was successfully deployed

1 active deployment
Preview — 78883497 Deployed Oct 24, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Mobile navbar blur doesn't feel good

1 participant