Reduce motion for boost animation (#5871)
* Reduce motion for boost animation Fixes #5833 * Fix ternary expression
This commit is contained in:
		
					parent
					
						
							
								35fdf561be
							
						
					
				
			
			
				commit
				
					
						a8eb0bf44f
					
				
			
		
					 2 changed files with 14 additions and 2 deletions
				
			
		| 
						 | 
				
			
			@ -2149,7 +2149,8 @@
 | 
			
		|||
 | 
			
		||||
@import 'boost';
 | 
			
		||||
 | 
			
		||||
button.icon-button i.fa-retweet {
 | 
			
		||||
.no-reduce-motion button.icon-button i.fa-retweet {
 | 
			
		||||
 | 
			
		||||
  background-position: 0 0;
 | 
			
		||||
  height: 19px;
 | 
			
		||||
  transition: background-position 0.9s steps(10);
 | 
			
		||||
| 
						 | 
				
			
			@ -2160,13 +2161,23 @@ button.icon-button i.fa-retweet {
 | 
			
		|||
  &::before {
 | 
			
		||||
    display: none !important;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
button.icon-button.active i.fa-retweet {
 | 
			
		||||
.no-reduce-motion button.icon-button.active i.fa-retweet {
 | 
			
		||||
  transition-duration: 0.9s;
 | 
			
		||||
  background-position: 0 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.reduce-motion button.icon-button i.fa-retweet {
 | 
			
		||||
  color: $ui-base-lighter-color;
 | 
			
		||||
  transition: color 100ms ease-in;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.reduce-motion button.icon-button.active i.fa-retweet {
 | 
			
		||||
  color: $ui-highlight-color;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.status-card {
 | 
			
		||||
  display: flex;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue