1905168 - Reader View buttons become transparent when text overlaps them, button accessibility is inconsistent

Status: NEW

(Toolkit :: Reader Mode, enhancement)

Description

[Daniel Bodea [:danibodea]]

Note

• When the user loads a webpage in reader view, opens the Text and layout menu and zooms in until the text overlaps the reader view buttons, he will notice that the buttons become transparent. Furthermore, some of them are accessible and others are not.
• Our suggestion for improvement would be either for all buttons to remain accessible when they become transparent or to make the buttons move further to the side when the text overlaps over their current position.

Found in

• Nightly v129.0a1

Affected versions

• Nightly v129.0a1

Tested platforms

• Affected platforms: all
• Unaffected platforms: none

Steps to reproduce

1. Load an article that is compatible with reader view:
   https://fr.wikipedia.org/wiki/Wikip%C3%A9dia:Accueil_principal
2. Enable reader view
3. Access the Text and layout menu
4. Zoom in until the text overlaps the reader view buttons
   Observe that the buttons

Expected result

• The reader view buttons should move further to the side when the text overlaps them.
  OR
• All buttons should remain properly visible and accessible (or all buttons become inaccessible)

Actual result

• The buttons become transparent
• The "X" button is inaccessible (the "Text and layout" menu closes when clicked)
• The "Themes" button is accessible (the "Theme" menu is opened when clicked)
• The "Pocket" button is accessible (the "Text and layout" menu closes and the "Pocket" menu is opened)

Regression range

• Not a regression. A similar behavior is seen in the design before this implementation.

Additional notes