| 1 |
- .popup-fade-center-active-show{animation:popup-center-fadein .3s forwards}.popup-fade-center-active-hide{animation:popup-center-fadeout .3s forwards}.popup-fade-top-active-show{animation:popup-top-fadein .3s forwards}.popup-fade-top-active-hide{animation:popup-top-fadeout .3s forwards}.popup-fade-left-active-show{animation:popup-left-fadein .3s forwards}.popup-fade-left-active-hide{animation:popup-left-fadeout .3s forwards}.popup-fade-right-active-show{animation:popup-right-fadein .3s forwards}.popup-fade-right-active-hide{animation:popup-right-fadeout .3s forwards}.popup-fade-bottom-active-show{animation:popup-bottom-fadein .3s forwards}.popup-fade-bottom-active-hide{animation:popup-bottom-fadeout .3s forwards}@keyframes popup-top-fadein{0%{transform:translate3d(0,-100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-top-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-100%,0);opacity:.1}}@keyframes popup-left-fadein{0%{transform:translate3d(-100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-left-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(-100%,0,0);opacity:.1}}@keyframes popup-right-fadein{0%{transform:translate3d(100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-right-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(100%,0,0);opacity:.1}}@keyframes popup-bottom-fadein{0%{transform:translate3d(0,100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-bottom-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,100%,0);opacity:.1}}@keyframes popup-center-fadein{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}@keyframes popup-center-fadeout{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1)}100%{transform:scale(.8);opacity:0}}@keyframes bg-fadein{0%{opacity:0}100%{opacity:1}}@keyframes bg-fadeout{0%{opacity:1}100%{opacity:0}}.container-popup{position:fixed;top:0;left:0;right:0;bottom:0}.container-bg-show{animation:bg-fadein .3s forwards}.container-bg-hide{animation:bg-fadeout .3s forwards}.container-bg{display:block;position:fixed;top:0;left:0;right:0;bottom:0;z-index:6;background:rgba(0,0,0,.4)}.popup-content{position:absolute;z-index:100;width:100%;max-width:100%;height:100%}.center{display:flex;height:100%;width:100%;flex-direction:row;align-items:center;justify-content:center}.left{display:flex;flex-direction:row;height:100%}.right{display:flex;flex-direction:row;justify-content:flex-end;height:100%}.bottom{display:flex;flex-direction:column-reverse;width:100%}
|
