Hello,
I'm using a native app and i'm trying to implement dark mode when the user has their phone in dark mode without any plugin, i'm trying with window.matchMedia('(prefers-color-scheme: dark)').matches and it works fine in ios, but it does not in android, i checked compatibility and i have the webview version 111 and chrome version 112.
Any suggestions?
Thanks
Hi António,
This seems to be a known bug on older versions of Android. The prefers-color-scheme media query has limited browser support for older browser versions, so users will not be able to benefit from having the dark mode applied using this media query in certain browser versions.
https://caniuse.com/?search=prefers-color-scheme
However, the dark mode can still be applied by using a CSS class fallback.
https://css-tricks.com/a-complete-guide-to-dark-mode-on-the-web/
Regards,
Daniel
Hi Daniel,
I have Android 13, that shouldn't be happening.
Indeed, what does it return? false? You get an error message?
Returns always true, i don't get an error message, and if i use it like this window.matchMedia('(prefers-color-scheme: light)') returns always false, even if my phone is on dark mode or not
Did you find any work around for that behaviour?
Hi Afonso,
For now, i check if the device is android, if it is , i hide the option of 'System', if is IOS then i show it, i was going to open a ticket, but never did it, i will see if i open a ticket, and keep this post updated.