Conversation
On narrow screens (<768px), hide the sidebar and show a fixed bottom navigation bar with the same nav icons, similar to Twitter/X mobile UI. The layout grid and dividers are made responsive so content takes full width on mobile, with bottom padding to avoid overlap with the nav bar. Co-authored-by: Cursor <cursoragent@cursor.com>
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
| )} | ||
| > | ||
| {link.icon} | ||
| </Link> |
There was a problem hiding this comment.
No organization switching capability on mobile
High Severity
The mobile bottom navigation displays only the five main navigation links but omits the OrgsMenu component that enables switching between organizations. Users with multiple organizations have no way to switch between them when accessing the application on mobile devices (screens below 768px), creating a critical functional gap. The OrgsMenu is only rendered in the desktop sidebar at line 264.
Added title and aria-label attributes to sidebar link components for improved accessibility, ensuring better screen reader support and user experience.
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.
| </div> | ||
|
|
||
| {/* Mobile bottom navigation */} | ||
| <nav className="fixed bottom-0 left-0 right-0 z-50 md:hidden border-t border-neutral-300 dark:border-neutral-800 bg-neutral-100 dark:bg-neutral-900"> |
There was a problem hiding this comment.
Mobile nav z-index renders above modal dialogs
Medium Severity
The new mobile bottom nav has z-50, but UnlockKeyringDialog (and likely other HeadlessUI dialogs) use z-10. Since the grid container creates no intermediate stacking context and HeadlessUI's Dialog renders via a Portal to document.body, these z-indices are compared at the root level. The bottom nav bar will visually appear on top of the dialog overlay and backdrop on mobile, breaking the modal experience and potentially allowing users to tap nav links through the modal.
1 participant
Summary
md:prefixed) so the content area takes full width on mobile.Screenshots
Before:
After:
Limitations:
Test plan
Made with Cursor
Note
Low Risk
Purely UI/layout changes (responsive classes and navigation presentation) with no auth/data flow changes; main risk is unintended overlap/spacing issues on small screens.
Overview
Adds a responsive navigation experience: the existing sidebar now renders only on
md+screens, whilemd:hiddenmobile view gets a fixed bottom icon nav with active-state highlighting.Updates the team
layout.tsxgrid/divider classes to bemd:-scoped so content uses full width on mobile, and adds mobile-only bottom padding (pb-14 md:pb-0) to prevent page content from being hidden behind the bottom nav.Written by Cursor Bugbot for commit 0a5d9e2. This will update automatically on new commits. Configure here.