Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Toolbar Example: Make clicking padding move focus into toolbar #987

Closed
mcking65 opened this issue Feb 10, 2019 · 3 comments · Fixed by #1700
Closed

Toolbar Example: Make clicking padding move focus into toolbar #987

mcking65 opened this issue Feb 10, 2019 · 3 comments · Fixed by #1700
Assignees
@jongund
Labels
enhancement Any addition or improvement that doesn't fix a code bug or prose inaccuracy Example Page Related to a page containing an example implementation of a pattern good first issue Issue with Straightforward resolution; could be good learning experience for new contributors help wanted Task force is looking for an owner for the issue
Milestone
1.2 Release 1

Comments

@mcking65
Copy link
Contributor

Per comment in issue 539
by @sh0ji about the toolbar example,
make clicking the padding of the toolbar (the gray #ECECEA part) move focus into the toolbar.
This enables people to use their mouse to orient their focus and then use their keyboard to navigate inside the toolbar.
@mcking65 mcking65 added enhancement Any addition or improvement that doesn't fix a code bug or prose inaccuracy help wanted Task force is looking for an owner for the issue Example Page Related to a page containing an example implementation of a pattern good first issue Issue with Straightforward resolution; could be good learning experience for new contributors labels Feb 10, 2019
@mcking65 mcking65 added this to the 1.1 APG Release 4 milestone Feb 10, 2019
@ardnahcivar
Copy link

@mcking65 , could you please elaborate the issue, i am unable to get it.

@sh0ji
Copy link
Contributor

sh0ji commented Mar 9, 2019

When a keyboard user first tabs into the toolbar, both the currently focused control AND the entire toolbar are visually focused via the dark blue outline. The entire toolbar gets a visual focus to convey to sighted users that it's a composite widget and that focus is managed within that larger container (arrow keys move focus inside of the toolbar).

This change would allow mouse users to set focus on the toolbar without having to actually click a control, something that's not currently possible.

@jongund jongund self-assigned this Aug 13, 2019
@mcking65 mcking65 removed this from the 1.1 APG Release 4 milestone Aug 13, 2019
maschad96 added a commit to maschad96/aria-practices that referenced this issue Apr 18, 2020
@maschad96
fixes w3c#987
24e84b2
@maschad96 maschad96 mentioned this issue Apr 18, 2020
Closed
2 tasks
@maschad96
Copy link
Contributor

Hi @jongund, @sh0ji , I submitted a PR for this. Would you mind reviewing and providing feedback when time allows? 😃

@mcking65 mcking65 added this to the 1.2 Release 1 milestone Jul 1, 2020
maschad96 added a commit to maschad96/aria-practices that referenced this issue Jul 21, 2020
@maschad96
fixes w3c#987
5927224
spectranaut pushed a commit that referenced this issue Dec 22, 2020
@maschad96
fixes #987
50782d1
@spectranaut spectranaut mentioned this issue Dec 22, 2020
Merged
mcking65 added a commit that referenced this issue Dec 22, 2020
@spectranaut @carmacleod
@maschad96 @mcking65
Toolbar Example: Set focus to button with tabindex="0" when the conta…
13ea4e3 
…iner is clicked (pull #1700)

fixes #987

Co-authored-by: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com>
Co-authored-by: Matthew Schad <matt@exactstrategy.com>
Co-authored-by: Matt King <a11yThinker@Gmail.com>
Co-authored-by: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@jongund jongund

Labels
enhancement Any addition or improvement that doesn't fix a code bug or prose inaccuracy Example Page Related to a page containing an example implementation of a pattern good first issue Issue with Straightforward resolution; could be good learning experience for new contributors help wanted Task force is looking for an owner for the issue
Projects
Toolbar Pattern and Examples Development Project
Status: Complete
Milestone
1.2 Release 1
5 participants
@jongund @mcking65 @sh0ji @ardnahcivar @maschad96