refactor:add transition
This commit is contained in:
		@@ -1,5 +1,7 @@
 | 
			
		||||
@import './element-ui.scss';
 | 
			
		||||
@import './mixin.scss';
 | 
			
		||||
@import './transition.scss';
 | 
			
		||||
 | 
			
		||||
body {
 | 
			
		||||
  -moz-osx-font-smoothing: grayscale;
 | 
			
		||||
  -webkit-font-smoothing: antialiased;
 | 
			
		||||
@@ -45,17 +47,6 @@ a:hover {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
//vue router transition css
 | 
			
		||||
.fade-enter-active,
 | 
			
		||||
.fade-leave-active {
 | 
			
		||||
  transition: all .2s ease
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fade-enter,
 | 
			
		||||
.fade-leave-active {
 | 
			
		||||
  opacity: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
//main-container全局样式
 | 
			
		||||
.app-main{
 | 
			
		||||
  min-height: 100%
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										32
									
								
								src/styles/transition.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										32
									
								
								src/styles/transition.scss
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,32 @@
 | 
			
		||||
//globl transition css
 | 
			
		||||
 | 
			
		||||
/*fade*/
 | 
			
		||||
.fade-enter-active,
 | 
			
		||||
.fade-leave-active {
 | 
			
		||||
  transition: opacity 0.28s;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fade-enter,
 | 
			
		||||
.fade-leave-active {
 | 
			
		||||
  opacity: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/*fade*/
 | 
			
		||||
.breadcrumb-enter-active,
 | 
			
		||||
.breadcrumb-leave-active {
 | 
			
		||||
  transition: all .5s;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.breadcrumb-enter,
 | 
			
		||||
.breadcrumb-leave-active {
 | 
			
		||||
  opacity: 0;
 | 
			
		||||
  transform: translateX(20px);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.breadcrumb-move {
 | 
			
		||||
  transition: all .5s;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.breadcrumb-leave-active {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user