mirror of
https://github.com/Unleash/unleash.git
synced 2025-06-04 01:18:20 +02: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