smoother fade-ins for modals

This commit is contained in:
Felix Hamann 2018-03-29 00:19:56 +02:00
parent 05dd196b43
commit 9858224bdd

View File

@ -2,7 +2,7 @@
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
transform: translate(-50%, -50%) scale(0.8, 0.8);
display: block;
background-color: rgba(255, 255, 255, 0.9);
min-width: 60vw;
@ -13,9 +13,13 @@
color: var(--fontbase);
padding: 20px;
overflow: auto;
opacity: 0;
transition: all .15s ease;
&.modal--open {
opacity: 1;
z-index: 200;
transform: translate(-50%, -50%) scale(1, 1);
}
}
@ -43,10 +47,12 @@
width: 100%;
background-color: transparent;
z-index: -1;
transition: background-color .2s ease;
opacity: 0;
transition: all .2s ease;
&.modal__overlay--open {
z-index: 199;
opacity: 1;
background-color: rgba(0, 0, 0, 0.4);
}
}