Toggle switch not usable in forced colors (high contrast) mode.

Solution in MR: In forced colors mode the toggle switch styling is cancelled, and native checkboxes are used instead.

Hi,

Tested the MR !276 to address the issue toggle switch not usable in forced color mode. it's works fine, issue points (instead of toggle, provide a solution by using checkbox as mention in #3) are covered in MR:

Testing Steps:
1. Install the Drupal 10.0.x version and enable gin 8.x.
2. on path 'admin/config/development/performance', enable the ( "Emulate CSS media feature forced-colors" ) in 'active" mode.
3. Switch to MR and verified the changes in update MR.

attached the screen for references.
Before:

After:

Looks Good for RTBC

@bnjmnm shouldn't we fix the toggle instead? 🤔

Hi @saschaeggi

as per your comment #5, Tried to theme the toggle button (needs only background css apply, functionality working fine) , but found that background color CSS property not working in forced-colors mode, it could be due to the limitations imposed by forced-colors mode itself. it's is a browser accessibility feature that overrides the specified colors on a web page, replacing them with a limited set of high-contrast colors that are more accessible to users. So in my case it's not possible to implant the default css to theme toggle button and checkbox is a good option instead of toggle button.

could know more : https://developer.mozilla.org/en-US/docs/Web/CSS/@media/forced-colors

shouldn't we fix the toggle instead?

I think it's best to use the native elements for high contrast users. One reason is that due to the many different themes of forced-colors mode, the only safe option is for the toggles to have the same color, on or off. This means the only means of identifying on/off is the position of the switch (maybe inverting the colors, but I'm not sure that helps mentally associate on/off).

Also, ythe toggles are an excellent design, but they're customizations. Any changes they get would need to be applied differently to forced-colors, and I'm unsure all contributors would remember to do that. Relying on the native elements for accessibility-requiring users provides them with a predictable experience, freeing Gin up to get more ambitious and innovative in default non-forced-colors mode.

Hi @bnjmnm, Conflicts in your MR, please resolved.

We shipped improvements for high contrast mode in the latest 3.x and 4.x dev and included improving the toggle styles.

Automatically closed - issue fixed for 2 weeks with no activity.