Test using inert to control text searchability
This commit is contained in:
parent
ced4dc86aa
commit
bdd238de0e
|
@ -41,6 +41,24 @@ function Modal({ children, onClose, onClick, class: className }) {
|
|||
);
|
||||
useCloseWatcher(onClose, [onClose]);
|
||||
|
||||
useEffect(() => {
|
||||
const $deckContainers = document.querySelectorAll('.deck-container');
|
||||
if (children) {
|
||||
$deckContainers.forEach(($deckContainer) => {
|
||||
$deckContainer.setAttribute('inert', '');
|
||||
});
|
||||
} else {
|
||||
$deckContainers.forEach(($deckContainer) => {
|
||||
$deckContainer.removeAttribute('inert');
|
||||
});
|
||||
}
|
||||
return () => {
|
||||
$deckContainers.forEach(($deckContainer) => {
|
||||
$deckContainer.removeAttribute('inert');
|
||||
});
|
||||
};
|
||||
}, [children]);
|
||||
|
||||
const Modal = (
|
||||
<div
|
||||
ref={(node) => {
|
||||
|
|
|
@ -153,6 +153,18 @@ function StatusPage(params) {
|
|||
return () => clearTimeout(timer);
|
||||
}, [showMediaOnly]);
|
||||
|
||||
useEffect(() => {
|
||||
const $deckContainers = document.querySelectorAll('.deck-container');
|
||||
$deckContainers.forEach(($deckContainer) => {
|
||||
$deckContainer.setAttribute('inert', '');
|
||||
});
|
||||
return () => {
|
||||
$deckContainers.forEach(($deckContainer) => {
|
||||
$deckContainer.removeAttribute('inert');
|
||||
});
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div class="deck-backdrop">
|
||||
{showMedia ? (
|
||||
|
|
Loading…
Reference in a new issue