Refactor the toolbar html & css to improve its overall accessibility (bug 1171799, bug 1855695) #18385
Conversation
calixteman
requested review from
Snuffleupagus and
timvandermeij
and removed request for
Snuffleupagus
calixteman
force-pushed
the
remove_tabindex
branch
from
eefaf87
to
1211489
Compare
calixteman
force-pushed
the
remove_tabindex
branch
from
1211489
to
4484fde
Compare
…sity in Firefox (bug 1171799) It's a first step to just dispatch the pref change to the toolbar. The second one, to effectively use it, will come after PR mozilla#18385 is merged.
…sity in Firefox (bug 1171799) It's a first step to just dispatch the pref change to the toolbar. The second one, to effectively use it, will come after PR mozilla#18385 is merged.
|
/botio-linux preview |
From: Bot.io (Linux m4)ReceivedCommand cmd_preview from @timvandermeij received. Current queue size: 0 Live output at: http://54.241.84.105:8877/5f907b0b00fc09a/output.txt |
From: Bot.io (Linux m4)SuccessFull output at http://54.241.84.105:8877/5f907b0b00fc09a/output.txt Total script time: 1.03 mins Published |
|
A couple of quick observations, with
Other observations, with
|
which can then be used for their future parent container. This patch aims to simplify a bit the patch in mozilla#18385.
which can then be used for their future parent container. This patch aims to simplify a bit the patch in mozilla#18385.
which can then be used for their future parent container. This patch aims to simplify a bit the patch in mozilla#18385.
…(bug 1171799, bug 1855695) The first goal of this patch was to remove the tabindex because it helps to improve overall a11y. That led to move some html elements associated with the buttons which helped to position these elements relatively to their buttons. Consequently it was easy to change the toolbar height (configurable in Firefox with the pref browser.uidensity): it's the second goal of this patch. For a11y reasons we want to be able to change the height of the toolbar to make the buttons larger.
calixteman
force-pushed
the
remove_tabindex
branch
from
4484fde
to
220416c
Compare
|
@Snuffleupagus I addressed the issues you found and shew on the screenshots. Of course, I'll address any obvious issues before merging that stuff and then we'd like to land it asap, to ask to QA to verify that there are no regressions. |
|
/botio-linux preview |
From: Bot.io (Linux m4)ReceivedCommand cmd_preview from @calixteman received. Current queue size: 0 Live output at: http://54.241.84.105:8877/ad665e7896265e5/output.txt |
From: Bot.io (Linux m4)SuccessFull output at http://54.241.84.105:8877/ad665e7896265e5/output.txt Total script time: 1.02 mins Published |
There was a problem hiding this comment.
Unfortunately there's still a number of (easily) spotted issues here:
- The findbar resizing looks really bad with a lot of wasted space, please revert those changes!
Quite frankly this doesn't belong in this PR, and generally speaking if a CSS-only solution cannot be made to work/look as good as the current solution then we need to keep the JS-code. - All dropdown menus seem to be slightly off horizontally. The screen-shot shows the findbar, but the secondaryToolbar and the editing-toolbars are similarly affected.
- The dropdown-arrows still don't have an outline all around; note the right-hand side in the (zoomed in) screen-shot below.
- There's no longer any visible separators in the secondaryToolbar.
|
About the separators on the secondary toolbar, it's a pre-existing bug. |
The first goal of this patch was to remove the tabindex because it helps to improve overall a11y. That led to move some html elements associated with the buttons which helped to position these elements relatively to their buttons.
Consequently it was easy to change the toolbar height (configurable in Firefox with the pref browser.uidensity): it's the second goal of this patch. For a11y reasons we want to be able to change the height of the toolbar to make the buttons larger.