Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.41k stars 1.99k forks source link

Enhancement: Improve Toggle Button Style #79154

Open kspilarski opened 1 year ago

kspilarski commented 1 year ago

What

Improve the style of the toggle buttons by adding a check mark or making the colors easier to see which options or settings are enabled and not.

Why

The toggle button is sometimes confusing for users whether an option or a setting is currently enabled or not. Also depending on the Dashboard Color Scheme selected, some toggle buttons can obviously show as enabled, while some like Contrast and Nightfall do not.

How

In the Interface settings in https://wordpress.com/me/account Dashboard color scheme, some colors like Contrast and Nightfall show the active and inactive toggle buttons as black and white making it confusing whether it's enabled or not.

Dashboard color scheme: Contrast

Contrast - discussion settings

Dashboard color scheme: Nightfall

Screenshot 2023-07-08 at 20 27 47

Other examples

Dashboard color scheme: Default

Default - discussion settings

The Privacy settings with the radio and check mark buttons make it easy to spot which one is selected:

Screenshot 2023-07-01 at 12 01 02

The Security settings have check marks that makes it easy to see which ones are done and exclamation points for those that are not selected:

Security settings - checkmark
cuemarie commented 1 year ago

📌 ACTIONS