ant-design-vue/components/trigger/assets/index.less

73 lines
1.4 KiB
Plaintext
Raw Normal View History

2017-12-25 10:08:36 +00:00
@triggerPrefixCls: rc-trigger-popup;
2017-12-26 11:04:28 +00:00
.fade-enter-active, .fade-leave-active {
transition: opacity 0.5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active in below version 2.1.8 */ {
opacity: 0;
}
2017-12-25 10:08:36 +00:00
.@{triggerPrefixCls} {
position: absolute;
left: -9999px;
top: -9999px;
z-index: 1050;
&-hidden {
display: none;
}
.effect() {
animation-duration: 0.3s;
animation-fill-mode: both;
}
&-zoom-enter,&-zoom-appear {
opacity: 0;
.effect();
animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
animation-play-state: paused;
}
&-zoom-leave {
.effect();
animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
animation-play-state: paused;
}
&-zoom-enter&-zoom-enter-active, &-zoom-appear&-zoom-appear-active {
animation-name: rcTriggerZoomIn;
animation-play-state: running;
}
&-zoom-leave&-zoom-leave-active {
animation-name: rcTriggerZoomOut;
animation-play-state: running;
}
@keyframes rcTriggerZoomIn {
0% {
opacity: 0;
transform-origin: 50% 50%;
transform: scale(0, 0);
}
100% {
opacity: 1;
transform-origin: 50% 50%;
transform: scale(1, 1);
}
}
@keyframes rcTriggerZoomOut {
0% {
opacity: 1;
transform-origin: 50% 50%;
transform: scale(1, 1);
}
100% {
opacity: 0;
transform-origin: 50% 50%;
transform: scale(0, 0);
}
}
}
@import "./mask";