Claro chevron looks like a diamond when in forced colors mode within Edge.
Within Firefox, it may not meet the contrast criteria.
Within Edge, this is happening because transparent borders are made opaque in forced colors mode. We need to completely remove the unneeded borders (not just make them transparent).
https://git.drupalcode.org/project/drupal/-/blob/10.0.x/core/themes/clar...
We should probably convert this to either use CSS mask image, or use CSS borders to create the chevron.
MS Edge:
Firefox:
Comment | File | Size | Author |
---|---|---|---|
#6 | 3269341-9.4.x-6.patch | 3.15 KB | mherchel |
#5 | 3269341-whcm-claro-arrows--edge.PNG | 12.13 KB | KurtTrowbridge |
#5 | 3269341-whcm-claro-arrows--firefox.PNG | 13.42 KB | KurtTrowbridge |
#5 | 3269341-whcm-claro-arrows--chrome.PNG | 12.54 KB | KurtTrowbridge |
#4 | 3269341-10.0.x-4.patch | 3.06 KB | mherchel |
|
Issue fork drupal-3269341
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
mherchelDrupal 10 patch attached.
Comment #3
mherchel💩 Doesn't work properly in FF
Comment #4
mherchelNew patch works properly in all browsers.
Comment #5
KurtTrowbridgeTested this in Windows High Contrast Mode with the patch applied, and the chevrons are looking good in Chrome, Edge, and Firefox now. I've attached screenshots from just one of the default color themes, but confirmed that all four appeared as expected, both when the element is opened or closed.
Comment #6
mherchelDiscussed this with @lauriii earlier today. Attached is a patch for 9.4.x that also supports IE11.
Using the same method, so leaving RTBC.
Comment #7
ckrinaChanging to 9.4.
Comment #11
ckrinaCommitted ab4a24f and pushed to 10.0.x. and 9.4.x. Thanks!
I'll leave this open to port it to 9.3.x after the patch release.
Comment #13
lauriiiCherry-picked to 9.3.x ✌️