Mobile: Text overflow on ticketing pages at 375px viewport #5
Reference in New Issue
Block a user
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Bug Report
Severity: Medium
Discovered by: Playwright QA (mobile suite, admin user, 375x812 viewport)
Affected Pages
/app/ticketing— 17 elements overflow (sidebar nav, group switcher, view counts all clip)/app/ticketing/settings— settings tab nav overflows ("Groups Agents Priorities Statuses Projects Au...")Expected
All text and navigation readable within 375px viewport
Actual
The ticketing sidebar and tab navigation extend beyond container bounds, clipping important UI elements
Suggested Fix
The sidebar may need a collapsible/drawer treatment on mobile. Settings tabs should wrap or use a scrollable tab row.
Fixed by adding min-w-0 to the aside element and overflow-hidden to its inner content container in Ticketing/Index.vue, preventing the sidebar from expanding past its flex allocation. Added truncate to the sidebar heading. The settings tab nav already had overflow-x-auto in place — no change needed there.