Quote:
Originally Posted by Slevin#7
I have some transparent PNG images (text-dividers and simple grafics). These images are no pictures but only simple drawings.
Since I wanna make sure that they can be seen and read in dark mode as well I've created two versions, one with black lines and text for the light mode and one in white for the dark mode. Both images have a transparent background to fit in nicely in the current active desgin.
While Apple Books displays the images correctly, Google Play Books won't comply in dark mode. Although Google Play Books grabs the intended image for the dark mode, it will add a light background to it for no reason, making the image a light square and completely unreadable, since the image for the dark mode consists only of white content.
How can I insist Google Play Books to keep their fingers off the image and leave it in original state? I'll get it, that Google thinks we developers are too stupid to cover these details, but what, if there are some eBook creators out there in the wild who actually know what they are doing (or at least think to know)?
I don't wanna create an extra version for dark mode without transparent background but dark background, since the background color set on the device varies.
How do you guys handle this issue for readers which do alter transparent images?
For testing reasons I've added an eBook which contains a text-divider which serves for both light and dark mode (the grafic is black and white for this purpose), and a line drawing in two versions, one for light and one for dark.
|
The problem here is that not all ereaders honor "@media (prefers-color-scheme: dark)" and so never your transparent .png for dark mode is enabled. If "@media (prefers-color-scheme: dark)" were honored, and you don't want to have two transparent .png (one for light, one for dark mode), you can appy the property "filter: invert(1) hue-rotate(180deg);" to your light mode png. Google Play Books is an awful ereader; its support for epub3 is very limited (and your ebooks are epub3) so don't expect much regarding to what Google Play Books can offer.
I made some minor modifications to the epub you uploaded, and it works in CHROME and FIREBOX
Try the following test:
1. Open the epub in Sigil.
2. Right-click on the Section0001.xhtml sheet and select "Open with..."
3. Choose to open that file with Chrome or Firefox.
Why did I tell you to open that sheet with one of those browsers? Because they handle "@media (prefers-color-scheme: dark)" well, and if you change the light mode to dark mode and vice versa, you'll see that everything appears as expected.
The problem is e-readers that don't respect @media and don't detect the change to dark mode.