Fix transition: all (#10699)
This commit is contained in:
		
							parent
							
								
									3feece700b
								
							
						
					
					
						commit
						9e044c9649
					
				
					 2 changed files with 6 additions and 2 deletions
				
			
		| 
						 | 
					@ -50,6 +50,7 @@ $content-width: 840px;
 | 
				
			||||||
        color: $darker-text-color;
 | 
					        color: $darker-text-color;
 | 
				
			||||||
        text-decoration: none;
 | 
					        text-decoration: none;
 | 
				
			||||||
        transition: all 200ms linear;
 | 
					        transition: all 200ms linear;
 | 
				
			||||||
 | 
					        transition-property: color, background-color;
 | 
				
			||||||
        border-radius: 4px 0 0 4px;
 | 
					        border-radius: 4px 0 0 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        i.fa {
 | 
					        i.fa {
 | 
				
			||||||
| 
						 | 
					@ -60,6 +61,7 @@ $content-width: 840px;
 | 
				
			||||||
          color: $primary-text-color;
 | 
					          color: $primary-text-color;
 | 
				
			||||||
          background-color: darken($ui-base-color, 5%);
 | 
					          background-color: darken($ui-base-color, 5%);
 | 
				
			||||||
          transition: all 100ms linear;
 | 
					          transition: all 100ms linear;
 | 
				
			||||||
 | 
					          transition-property: color, background-color;
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        &.selected {
 | 
					        &.selected {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1972,6 +1972,7 @@ a.account__display-name {
 | 
				
			||||||
  font-weight: 500;
 | 
					  font-weight: 500;
 | 
				
			||||||
  border-bottom: 2px solid lighten($ui-base-color, 8%);
 | 
					  border-bottom: 2px solid lighten($ui-base-color, 8%);
 | 
				
			||||||
  transition: all 50ms linear;
 | 
					  transition: all 50ms linear;
 | 
				
			||||||
 | 
					  transition-property: border-bottom, background, color;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  .fa {
 | 
					  .fa {
 | 
				
			||||||
    font-weight: 400;
 | 
					    font-weight: 400;
 | 
				
			||||||
| 
						 | 
					@ -2137,7 +2138,7 @@ a.account__display-name {
 | 
				
			||||||
  padding: 0;
 | 
					  padding: 0;
 | 
				
			||||||
  border-radius: 30px;
 | 
					  border-radius: 30px;
 | 
				
			||||||
  background-color: $ui-base-color;
 | 
					  background-color: $ui-base-color;
 | 
				
			||||||
  transition: all 0.2s ease;
 | 
					  transition: background-color 0.2s ease;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
 | 
					.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
 | 
				
			||||||
| 
						 | 
					@ -2190,7 +2191,6 @@ a.account__display-name {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.react-toggle-thumb {
 | 
					.react-toggle-thumb {
 | 
				
			||||||
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
 | 
					 | 
				
			||||||
  position: absolute;
 | 
					  position: absolute;
 | 
				
			||||||
  top: 1px;
 | 
					  top: 1px;
 | 
				
			||||||
  left: 1px;
 | 
					  left: 1px;
 | 
				
			||||||
| 
						 | 
					@ -2201,6 +2201,7 @@ a.account__display-name {
 | 
				
			||||||
  background-color: darken($simple-background-color, 2%);
 | 
					  background-color: darken($simple-background-color, 2%);
 | 
				
			||||||
  box-sizing: border-box;
 | 
					  box-sizing: border-box;
 | 
				
			||||||
  transition: all 0.25s ease;
 | 
					  transition: all 0.25s ease;
 | 
				
			||||||
 | 
					  transition-property: border-color, left;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.react-toggle--checked .react-toggle-thumb {
 | 
					.react-toggle--checked .react-toggle-thumb {
 | 
				
			||||||
| 
						 | 
					@ -3552,6 +3553,7 @@ a.status-card.compact:hover {
 | 
				
			||||||
    display: inline-block;
 | 
					    display: inline-block;
 | 
				
			||||||
    opacity: 0;
 | 
					    opacity: 0;
 | 
				
			||||||
    transition: all 100ms linear;
 | 
					    transition: all 100ms linear;
 | 
				
			||||||
 | 
					    transition-property: transform, opacity;
 | 
				
			||||||
    font-size: 18px;
 | 
					    font-size: 18px;
 | 
				
			||||||
    width: 18px;
 | 
					    width: 18px;
 | 
				
			||||||
    height: 18px;
 | 
					    height: 18px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in a new issue