UX: Add auto focus to hamburger and user menu dropdowns (#13165)

This commit is contained in:
Robin Ward 2021-05-26 16:45:52 -04:00 committed by GitHub
parent ea68bab135
commit b9053c5e77
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 0 deletions

View File

@ -506,11 +506,21 @@ export default createWidget("header", {
this.state.userVisible = !this.state.userVisible;
this.toggleBodyScrolling(this.state.userVisible);
// auto focus on first button in dropdown
schedule("afterRender", () =>
document.querySelector(".user-menu button")?.focus()
);
},
toggleHamburger() {
this.state.hamburgerVisible = !this.state.hamburgerVisible;
this.toggleBodyScrolling(this.state.hamburgerVisible);
// auto focus on first link in dropdown
schedule("afterRender", () => {
document.querySelector(".hamburger-panel .menu-links a")?.focus();
});
},
toggleBodyScrolling(bool) {