Disable dark theme only on web version Ionic Capacitor (keep on iOS and Android)

Question

I have Ionic application that run PWA (web), iOS and Android. I've tried to disable dark mode on web version by setting

<meta name="color-scheme" content="light" />

but it didn't worked.

In my variables.css:

@media (prefers-color-scheme: dark) {
    body {
       ...
    }
    .ios body {
       ...
    }
    .md body {
       ...
    }
}

My web and android version referring to .md tag so I cannot remove it. But I need it to work on iOS and Android. How can I resolve it?

Answer 1

You can try to remove the CSS :

<meta name="color-scheme" content="light dark" />

@media (prefers-color-scheme: dark) {
  ...
}

This post can help : https://stackoverflow.com/questions/63794562/disable-dark-theme-in-ionic#:~:text=One%20way%20to%20remove%20the,dark%20theme%20on%20the%20device.