Problem
The primary mobile navigation links, database expanders, and close button render at 40px high, while the same component already establishes a 44x44px mobile hamburger target. This creates an inconsistent and undersized touch path immediately after the menu opens.
Evidence
navLinkClasses defines every primary and nested navigation link with "min-h-[40px]" (Sidebar.tsx:66-85); the database disclosure button uses the same 40px height (Sidebar.tsx:111-133), and the mobile close button is "min-h-[40px] min-w-[40px]" (Sidebar.tsx:184-190). In contrast, the opening hamburger explicitly uses "min-h-[44px] min-w-[44px]" at Sidebar.tsx:149-155.
Impact
At 360x640, all route selection and database disclosure interactions within the opened drawer are only 40px tall. The four-pixel deficiency is repeated across the primary navigation rather than isolated to a tertiary action. These controls occupy the initial viewport and control access to the app's main routes, so this above-fold finding is high severity.
Implementation plan
Promote the shared sidebar navigation/disclosure/close target rule to the already-used 44px minimum and retain the existing icon and label layout. Use the mobile hamburger dimensions as the canonical local pattern; keep the scrollable nav region so the modest height increase remains reachable with many databases.
Acceptance criteria
- Every primary link, database disclosure, and close control in the mobile sidebar has a rendered target of at least 44x44 CSS px at 360x640.
- The 44px hamburger, drawer close, links, and database expanders use a consistent target-size rule.
- With enough databases to require scrolling, all sidebar destinations and the theme control remain reachable at 360x640.
Verification
At 360x640, open the drawer and inspect bounding rectangles for a top navigation link, a database expander, and the close button. Tap adjacent items and ensure each intended route/disclosure fires without overlap. Repeat at 768x1024 and 1280x800 to confirm the desktop sidebar retains its existing behavior.
Dependencies and related work
No dependency. Coordinate only with the shared dynamic-height shell change so the longer mobile drawer remains fully scrollable.
Scope
Complexity: low. Files: Sidebar.tsx and an optional shared control-size utility if one already exists. Non-goals: changing navigation hierarchy, labels, or sidebar information architecture.
Problem
The primary mobile navigation links, database expanders, and close button render at 40px high, while the same component already establishes a 44x44px mobile hamburger target. This creates an inconsistent and undersized touch path immediately after the menu opens.
Evidence
navLinkClassesdefines every primary and nested navigation link with"min-h-[40px]"(Sidebar.tsx:66-85); the database disclosure button uses the same 40px height (Sidebar.tsx:111-133), and the mobile close button is"min-h-[40px] min-w-[40px]"(Sidebar.tsx:184-190). In contrast, the opening hamburger explicitly uses"min-h-[44px] min-w-[44px]"atSidebar.tsx:149-155.Impact
At 360x640, all route selection and database disclosure interactions within the opened drawer are only 40px tall. The four-pixel deficiency is repeated across the primary navigation rather than isolated to a tertiary action. These controls occupy the initial viewport and control access to the app's main routes, so this above-fold finding is high severity.
Implementation plan
Promote the shared sidebar navigation/disclosure/close target rule to the already-used 44px minimum and retain the existing icon and label layout. Use the mobile hamburger dimensions as the canonical local pattern; keep the scrollable nav region so the modest height increase remains reachable with many databases.
Acceptance criteria
Verification
At 360x640, open the drawer and inspect bounding rectangles for a top navigation link, a database expander, and the close button. Tap adjacent items and ensure each intended route/disclosure fires without overlap. Repeat at 768x1024 and 1280x800 to confirm the desktop sidebar retains its existing behavior.
Dependencies and related work
No dependency. Coordinate only with the shared dynamic-height shell change so the longer mobile drawer remains fully scrollable.
Scope
Complexity: low. Files:
Sidebar.tsxand an optional shared control-size utility if one already exists. Non-goals: changing navigation hierarchy, labels, or sidebar information architecture.