Mirrors/webamp
1
0
Fork 0
mirror of https://github.com/captbaritone/webamp.git synced 2026-07-23 01:57:29 +00:00
Code Issues Projects Releases Wiki Activity

Fade in overlay

Browse source
This commit is contained in:
Jordan Eldredge 2018-11-25 23:40:50 -08:00
parent b2a38f22e5
commit 23e6cd75e3
2 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/App.css
View file

@ -25,7 +25,12 @@ body.overlay-open {
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.9);
background-color: rgba(0, 0, 0, 0);
transition: background-color 400ms ease-out;
}
body.overlay-open .overlay {
background: rgba(0, 0, 0, 0.9);
}
#close-modal {

7
src/Overlay.js
View file

@ -15,7 +15,12 @@ class Overlay extends React.Component {
componentDidMount() {
window.document.addEventListener("keydown", this._handleKeyDown);
document.body.classList.add("overlay-open");
// TODO: This is technically a race condition, since we could unmount before this fires.
requestAnimationFrame(() => {
// This does not seem to work the first time.
// This should _not_ work on page load
document.body.classList.add("overlay-open");
});
}
componentWillUnmount() {