From 272566043a1b25db012c8d0dd4ccc7ac909a3d77 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Sat, 21 Nov 2020 23:54:36 +0100 Subject: [PATCH] Remove fade-in animation from modals in web UI (#15199) --- app/javascript/mastodon/components/modal_root.js | 16 ++-------------- app/javascript/styles/mastodon/components.scss | 2 -- 2 files changed, 2 insertions(+), 16 deletions(-) diff --git a/app/javascript/mastodon/components/modal_root.js b/app/javascript/mastodon/components/modal_root.js index 6297b5e293..fe573ffdaf 100644 --- a/app/javascript/mastodon/components/modal_root.js +++ b/app/javascript/mastodon/components/modal_root.js @@ -9,11 +9,7 @@ export default class ModalRoot extends React.PureComponent { onClose: PropTypes.func.isRequired, }; - state = { - revealed: !!this.props.children, - }; - - activeElement = this.state.revealed ? document.activeElement : null; + activeElement = this.props.children ? document.activeElement : null; handleKeyUp = (e) => { if ((e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27) @@ -53,8 +49,6 @@ export default class ModalRoot extends React.PureComponent { this.activeElement = document.activeElement; this.getSiblings().forEach(sibling => sibling.setAttribute('inert', true)); - } else if (!nextProps.children) { - this.setState({ revealed: false }); } } @@ -72,11 +66,6 @@ export default class ModalRoot extends React.PureComponent { console.error(error); }); } - if (this.props.children) { - requestAnimationFrame(() => { - this.setState({ revealed: true }); - }); - } } componentWillUnmount () { @@ -94,7 +83,6 @@ export default class ModalRoot extends React.PureComponent { render () { const { children, onClose } = this.props; - const { revealed } = this.state; const visible = !!children; if (!visible) { @@ -104,7 +92,7 @@ export default class ModalRoot extends React.PureComponent { } return ( -
+
{children}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 056ea3dd2d..ab2a5ac617 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -4439,8 +4439,6 @@ a.status-card.compact:hover { .modal-root { position: relative; - transition: opacity 0.3s linear; - will-change: opacity; z-index: 9999; }