Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: more use of slide toggle #7169

Merged
merged 1 commit into from May 14, 2024
Merged

chore: more use of slide toggle #7169

merged 1 commit into from May 14, 2024

Conversation

deboer-tim
Copy link
Collaborator

What does this PR do?

We have toggle switches in several places, but none of them were the same code. This updates the existing SlideToggle to support a few more cases (properties, aria, label on left or right) and adds colors for light mode. The component is then reused for Settings > Preferences and Settings > Proxies.

I had to make a couple judgement calls to make things consistent:

  • The switch (circle) is bigger than before in Preferences.
  • The proxy text gets dimmer when disabled/off, to match what was happening in preferences.
  • I added missing hover states, making each one step brighter to match Buttons, except I made the off-hover state purple to match other controls to let you know you can click on it.

Screenshot / video of UI

Screen.Recording.2024-05-10.at.4.52.30.PM.mov

What issues does this PR fix or reference?

Fixes #7168.

How to test this PR?

Check toggles in Settings > Preferences and Settings > Proxies. Basic SlideToggle tests were missing, so I added and extended those.

  • Tests are covering the bug fix or the new feature

@deboer-tim deboer-tim requested review from benoitf and a team as code owners May 10, 2024 20:54
@deboer-tim deboer-tim requested review from dgolovin and lstocchi and removed request for a team May 10, 2024 20:54
@deboer-tim deboer-tim requested a review from ekidneyrh May 11, 2024 11:36
We have toggle switches in several places, but none of them were
the same code. This updates the existing SlideToggle to support a
few more cases (properties, aria, label on left or right) and adds
colors for light mode. The component is then reused for Settings >
Preferences and Settings > Proxies.

I had to make a couple judgement calls to make things consistent:
- The switch (circle) is bigger than before in Preferences.
- The proxy text gets dimmer when disabled/off, to match what was
  happening in preferences.
- I added missing hover states, making each one step brighter to
  match Buttons, except I made the off-hover state purple to match
  other controls to let you know you can click on it.

Signed-off-by: Tim deBoer <[email protected]>
@deboer-tim
Copy link
Collaborator Author

Rebased to pick up conflicting changes in main.

@deboer-tim deboer-tim merged commit 60bb493 into main May 14, 2024
8 checks passed
@deboer-tim deboer-tim deleted the input-toggle branch May 14, 2024 19:48
@podman-desktop-bot podman-desktop-bot added this to the 1.11.0 milestone May 14, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Inconsistent toggle buttons, light mode
4 participants