github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-01-21 18:36:14 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Robin Ward 2021-05-26 16:45:52 -04:00 committed by Neil Lalonde
parent 8170563693
commit 45dca791b0
No known key found for this signature in database
GPG Key ID: FF871CA9037D0A91
1 changed files with 10 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/assets/javascripts/discourse/app/widgets/header.js
View File

@ -496,11 +496,21 @@ export default createWidget("header", {
this.state.userVisible = !this.state.userVisible; this.state.userVisible = !this.state.userVisible;
this.toggleBodyScrolling(this.state.userVisible); this.toggleBodyScrolling(this.state.userVisible);
// auto focus on first button in dropdown
schedule("afterRender", () =>
document.querySelector(".user-menu button")?.focus()
);
}, },
toggleHamburger() { toggleHamburger() {
this.state.hamburgerVisible = !this.state.hamburgerVisible; this.state.hamburgerVisible = !this.state.hamburgerVisible;
this.toggleBodyScrolling(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) { toggleBodyScrolling(bool) {