Skip to content

DataViews: Move Spinner and 'No results' at the top #67730

Open
@afercia

Description

Description

When the DataViews is fetching data to show, it shows a Spinner. When there are no results, it shows a 'No results' text.
Both are shown vertically centered, in the middle of the panel.
The results are, of course, shown at the top.

While displaying content in the middle of a (mostly) empty panel may look more 'elegant' and balanced at first, it's not ideal for accessibility:

  • As a low vision user, I may entirely miss the Spinner. It's a very light gray shape in the middle of a big white space, which is very difficult to notice for low vision users.
  • Same for the 'No results' text: it's a small text in the middle of a big white space.
  • As a screen magnifier user, I would expect important information to be shown in proximity of other controls. I may be using a very high zoom level focusing on the search and filter controls at the top of the panel and entirely miss content that is shown far from the main UI controls.

I'm not sure whether there are specific design reasons to show this content in the middle of the panel other than aesthetic reasons. Anyways, I'd like to propose to move it at the top, immediately below the search and filter

Image

Step-by-step reproduction instructions

  • Go to the Site Editor > Pages
  • Obseerve that, while pages are being fetched, a Spinner is shown in the middle of the white panel.
  • Click a page type that doesn't return any result, e.g. make sure you don't have any 'Private' page and click Private.
  • Observe that a 'No results' message is shown in the middle of the white panel.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

  • Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

  • Yes

Please confirm which theme type you used for testing.

  • Block
  • Classic
  • Hybrid (e.g. classic with theme.json)
  • Not sure

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

Labels

Needs Design FeedbackNeeds general design feedback.[Feature] DataViewsWork surrounding upgrading and evolving views in the site editor and beyond[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).[Status] In ProgressTracking issues with work in progress[Type] BugAn existing feature does not function as intended

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions