mirror of
				https://github.com/mdbootstrap/mdb-ui-kit.git
				synced 2025-11-04 01:47:35 +03:00 
			
		
		
		
	Merge pull request #59 from cncolder/prevent-checkbox-animate
make checkbox animate quickly when not hover.
This commit is contained in:
		
						commit
						57baace071
					
				
							
								
								
									
										3
									
								
								.gitignore
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										3
									
								
								.gitignore
									
									
									
									
										vendored
									
									
								
							| 
						 | 
				
			
			@ -1,3 +1,6 @@
 | 
			
		|||
# https://git-scm.com/docs/gitignore
 | 
			
		||||
# https://help.github.com/articles/ignoring-files
 | 
			
		||||
# Example .gitignore files: https://github.com/github/gitignore
 | 
			
		||||
 | 
			
		||||
Thumbs.db
 | 
			
		||||
.DS_Store
 | 
			
		||||
| 
						 | 
				
			
			@ -66,10 +66,17 @@
 | 
			
		|||
 | 
			
		||||
    // Ripple effect on click
 | 
			
		||||
    input[type=checkbox]:not(:checked) ~ .check:after {
 | 
			
		||||
        .animation(rippleOff 500ms);
 | 
			
		||||
        .animation(rippleOff 500ms linear forwards);
 | 
			
		||||
    }
 | 
			
		||||
    input[type=checkbox]:checked ~ .check:after {
 | 
			
		||||
        .animation(rippleOn 500ms);
 | 
			
		||||
        .animation(rippleOn 500ms linear forwards);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // Make animate quickly when not hover
 | 
			
		||||
    &:not(:hover) input[type=checkbox] ~ .check {
 | 
			
		||||
         &:before, &:after {
 | 
			
		||||
             .animation-duration(1ms);
 | 
			
		||||
         }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // Style for disabled inputs
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -98,6 +98,7 @@
 | 
			
		|||
    -moz-animation-duration: @duration;
 | 
			
		||||
    -ms-animation-duration: @duration;
 | 
			
		||||
    -o-animation-duration: @duration;
 | 
			
		||||
    animation-duration: @duration;
 | 
			
		||||
}
 | 
			
		||||
.animation-fill-mode(@mode) {
 | 
			
		||||
    -webkit-animation-fill-mode: @mode;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue
	
	Block a user