Adding the right timing to the modal transition.
This commit is contained in:
Родитель
26e03a6321
Коммит
b097f47808
|
@ -979,14 +979,16 @@ input[type="button"] {
|
|||
background-color: #fff;
|
||||
-webkit-transform: translate3d(0, 100%, 0);
|
||||
transform: translate3d(0, 100%, 0);
|
||||
-webkit-transition: -webkit-transform .25s ease-in-out, opacity 1ms .25s;
|
||||
transition: transform .25s ease-in-out, opacity 1ms .25s;
|
||||
-webkit-transition: -webkit-transform .25s, opacity 1ms .25s;
|
||||
transition: transform .25s, opacity 1ms .25s;
|
||||
-webkit-transition-timing-function: cubic-bezier(0.1, 0.5, 0.1, 1);
|
||||
}
|
||||
.modal.active {
|
||||
opacity: 1;
|
||||
height: 100%;
|
||||
-webkit-transition: -webkit-transform .25s ease-in-out;
|
||||
transition: transform .25 ease-in-out;
|
||||
-webkit-transition: -webkit-transform .25s;
|
||||
transition: transform .25s;
|
||||
-webkit-transition-timing-function: cubic-bezier(0.1, 0.5, 0.1, 1);
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
|
|
@ -13,15 +13,17 @@
|
|||
background-color: #fff;
|
||||
-webkit-transform: translate3d(0, 100%, 0);
|
||||
transform: translate3d(0, 100%, 0);
|
||||
-webkit-transition: -webkit-transform .25s ease-in-out, opacity 1ms .25s;
|
||||
transition: transform .25s ease-in-out, opacity 1ms .25s;
|
||||
-webkit-transition: -webkit-transform .25s, opacity 1ms .25s;
|
||||
transition: transform .25s, opacity 1ms .25s;
|
||||
-webkit-transition-timing-function: cubic-bezier(.1, .5, .1, 1); // Inspired by @c2prods
|
||||
|
||||
// Active modal
|
||||
&.active {
|
||||
opacity: 1;
|
||||
height: 100%;
|
||||
-webkit-transition: -webkit-transform .25s ease-in-out;
|
||||
transition: transform .25 ease-in-out;
|
||||
-webkit-transition: -webkit-transform .25s;
|
||||
transition: transform .25s;
|
||||
-webkit-transition-timing-function: cubic-bezier(.1, .5, .1, 1); // Inspired by @c2prods
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
|
Загрузка…
Ссылка в новой задаче