Paging controls on narrow screens have broken layout in React editor when the sidebar is open

Description

With the sidebar closed, the stats/filter controls will collapse to make room for the paging controls when the screen is too narrow for both. With the sidebar open, the available space is less but the controls will still only collapse based on the width of the whole window.

This could be solved in a few different ways:

  • Move the sidebar so it is below all the headers and does not impact their layout.

  • Change the collapsing behaviour so it is based on panel width rather than window width.

  • Some other layout fix, e.g. make sure the header expands to accommodate the paging controls if they wrap.

Environment

None

Status

Assignee

Kathryn Gough

Reporter

David Mason

Labels

None

Tested Version/s

None

Components

Sprint

None

Fix versions

Priority

unspecified
Configure