Accessibility
To implement an accessible PatternFly backdrop:
- If using just a backdrop component rather than PatternFly's modal, you must trap focus inside of the modal and disable any functionality outside of it. This can be done with a
FocusTrap
or any alternative means of disabling all of the content behind the backdrop.
Testing
At a minimum, a backdrop should meet the following criteria:
React customization
A backdrop does not have any further React props for accessibility.
HTML/CSS customization
A backdrop does not have any further HTML/CSS attributes or classes for accessibility.
View source on GitHub