[Bug]: Top toolbar lacking semantics

[sara-temby-design]

Describe the bug

The HTML markup for the top toolbar needs semantics. The buttons should be marked up as an unordered list to indicate the number of items clearly, and ideally, this would be grouped into a labeled <section>.

To Reproduce

Inspect top toolbar elements.

System

No response

Additional context

No response

[sara-temby-design]

#A11y issue

[mehm8128]

I'll work for this issue.

[Sidnioulz]

Still left to do:

• Switch the span used as an aria-labelledby to a heading?
• Make sure children are part of an unordered list, so the number of tools is announced early, by wrapping each child item inside a li and the whole content inside a ul

Pending verification, as I'm unsure whether this wouldn't cause UX regressions for non-blind users; I've asked around and am waiting for feedback from more experienced people:

• Implement toolbar role and add orientation ARIA attribute
• Implement keyboard navigation pattern required for toolbars