github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-11-25 09:41:49 +08:00
Code Issues Actions 46 Packages Projects Releases Wiki Activity

Fix drawer focus trap making login form unclickable on mobile

Browse Source 
Adding `clickOutsideDeactivates` seems to fix the issue, contrary to what the focus-trap documentation implies about it being unnecessary.
This commit is contained in:
Alexander Skvortsov 2021-12-26 22:45:58 -05:00
parent 0c95d28e94
commit d89031f057
No known key found for this signature in database
GPG Key ID: C4E3BBF9C3412B4C
1 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
js/src/common/utils/Drawer.js
View File

@ -27,7 +27,10 @@ export default class Drawer {
}); });
this.appElement = document.getElementById('app'); this.appElement = document.getElementById('app');
this.focusTrap = createFocusTrap('#drawer', { allowOutsideClick: true }); // Despite the `focus-trap` documentation, both `clickOutsideDeactivates`
// and `allowOutsideClick` are necessary so that inputs in modals triggered
// from the drawer's nav components can be interacted with.
this.focusTrap = createFocusTrap('#drawer', { allowOutsideClick: true, clickOutsideDeactivates: true });
this.drawerAvailableMediaQuery = window.matchMedia( this.drawerAvailableMediaQuery = window.matchMedia(
`(max-width: ${getComputedStyle(document.documentElement).getPropertyValue('--screen-phone-max')})` `(max-width: ${getComputedStyle(document.documentElement).getPropertyValue('--screen-phone-max')})`
); );