Conversation
|
Could you please screenshot the actual CSS background value of the icon? If it's SVG, it may be potentially fixed in the next release. |
|
Thanks, the issue was those SVGs with viewBox but no width and height were behaving differently to those the Dark Reader was making. Should be fixed in the next release. |
|
So... there is new version of Dark Reader released. @smokris can you check if your page works fine with it? If yes then this PR should be closed without merge. |
…le 'viewbox' capitalization variations, and handle double-quotes
|
Thanks for the info. I updated to Dark Reader 4.9.119 just now, but unfortunately the problem remains. Here's a simplified test case that reproduces the problem: test.html I think there are 2 separate problems here:
|
|
@alexanderby I am not that much experienced into code outside config folder. Maybe you can take a look here again. 😉 |
|
@smokris Thank you for providing a test case and for pointing out the single quotes and the URL encoding. Brilliant! This is fixed now, as well as overriding of the
|
| --darkreader-bg--white: 23, 23, 23 !important; | ||
| --darkreader-text--black: 228, 224, 218 !important; | ||
| } | ||
| body:has(> div[data-drupal-claro-processed-toolbar]) .form-element--type-select { |
There was a problem hiding this comment.
The static fix should be unnecessary now.
| else { | ||
| svgText = decodeURIComponent(svgText); | ||
| } | ||
| const svgOpeningMatch = svgText.match(/^<svg( .*?)?>/); |
There was a problem hiding this comment.
I improved the old solution based on indexOf, so the code changes are unnecessary now.
| it('should analyze viewbox-only, URI-encoded icon', async () => { | ||
| const details = await getImageDetails("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3e%3cpath fill='none' stroke-width='1.5' d='M1 1l6 6 6-6' stroke='%23545560'/%3e%3c/svg%3e"); | ||
| expect(details.width).toBe(14); | ||
| expect(details.height).toBe(9); |
There was a problem hiding this comment.
If you could put expect(details.useViewBox).toBe(true); that would be awesome.


The Drupal content management system's default admin theme styles
<select>elements, adding a custom arrow image. Dark Reader's adjustments cause the arrow image to be rendered too large. This PR adds a CSS override to improve the styling.In the "Dark Reader before" screenshot above, I added pink arrows pointing to the misrendered
<select>arrow.