mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	fix: restore focus style to the env switch (#9707)
Removes the "disableRipple" prop from the FeatureToggleSwitch component, thereby restoring its focus styles, so that keyboard users can see where their focus is at. I don't know the reason this was added originally (the PR doesn't say anything about it), but the prop changes nothing when hovering with the mouse, but it does remove focus styles for keyboard navigation. By removing it, we can bring the focus style back. As far as I can tell, there's no other difference between the two states. Both of these screenies have focus on the toggle, but in the first screenie there's no way to tell. With the prop: <img width="397" alt="image" src="https://github.com/user-attachments/assets/b9a5d764-ec5a-4d3b-b79d-0b52d7bd6891" /> Without the prop: <img width="445" alt="image" src="https://github.com/user-attachments/assets/3c95c7a6-91de-4ed2-9942-e9fc794e9d40" /> Because the component is used in multiple places, this also fixes this issue in the project flag list (and maybe elsewhere too): <img width="336" alt="image" src="https://github.com/user-attachments/assets/6582c58b-fabe-40ce-a141-06b22189a462" />
This commit is contained in:
		
							parent
							
								
									588e35e759
								
							
						
					
					
						commit
						6ea823f011
					
				| @ -56,7 +56,6 @@ export const FeatureToggleSwitch: VFC<FeatureToggleSwitchProps> = ({ | ||||
|                     inputProps={{ 'aria-label': environmentName }} | ||||
|                     onClick={onClick} | ||||
|                     data-testid={'permission-switch'} | ||||
|                     disableRipple | ||||
|                     disabled={value !== isChecked} | ||||
|                 /> | ||||
|             </StyledBoxContainer> | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user