element dialog動畫

自定義element dialog動畫

.el-dialog__wrapper {
	transition-duration: 0.6s;
}
.dialog-fade-enter-active{
	animation: none !important;
}
.dialog-fade-leave-active {
	transition-duration: 0.4s !important;
	animation: none !important;
  }
 
.dialog-fade-enter-active .el-dialog,
.dialog-fade-leave-active .el-dialog{
	animation-fill-mode: forwards;
}
 
.dialog-fade-enter-active .el-dialog{
	animation-duration: 0.6s;
	animation-name: anim-open;
	animation-timing-function: cubic-bezier(0.6,0,0.4,1);
}
 
.dialog-fade-leave-active .el-dialog{
	animation-duration: 0.6s;
	animation-name: anim-close;
}
 
 
@keyframes anim-open {
	0% { opacity: 0;  transform: scale3d(0.7, 0.7, 1); }
	100% { opacity: 1; transform: scale3d(1, 1, 1); }
}
 
 
@keyframes anim-close {
	0% { opacity: 1; }
	100% { opacity: 0; transform: scale3d(0.8, 0.8, 1); }
}