Page MenuHomePhabricator

Make the Edit toolbar responsive on mobile
Open, Needs TriagePublic

Description

Background

As part of T400903, we explored improvements to the mobile edit toolbar. One of these improvements is to make it responsive so it adapts to different screen sizes to show more actions on larger screens while prioritizing core actions on smaller ones.

Proposed solution

image.png (1×1 px, 102 KB)
Grabación de pantalla 2026-04-13 a las 16.56.47.gif (347×490 px, 1 MB)
  • Define a priority system where core actions are always easily accessible
  • Always show core actions (e.g. Undo, Text styles, Link, Add +)
  • Show secondary actions (e.g. Cite, Suggestions) only if space allows. If not, lower-priority actions will be included within the Add + or More options (ellipsis) menus
  • Ensure a minimum button width of 40px; when space is limited

Based on this approach, the number of options in the toolbar (apart from Close and Publish that will be fixed, will be:

  • 320px screens: Up to 5 options
  • 360px screens: Up to 6 options
  • 393px screens (and more): Up to 7 options

Acceptance criteria (or Done)

  • Explore responsive edit toolbar on mobile
  • Implement decided solution