Отключить темную тему в Ionic

Question

Я разрабатываю приложение Ionic, и мне хотелось бы, чтобы у него был белый фон и черный текст, независимо от того, активировал ли пользователь темную тему или нет .

Вот чего я хочу:

Однако, когда я включаю темную тему на телефоне Android, она автоматически преобразуется в это:

Я хочу, чтобы этого не случилось. Я искал в Интернете и нашел много статей, в которых описывается, как применить темную тему , но я не нашел ничего об ее отключении.

Одно из решений, о котором я подумал, - это явно включить темную тему, а затем установить те же цвета для темной темы, что и для светлой темы. Однако я думаю, что такой подход может быть нежелательным, поскольку он предполагает написание большого количества избыточного кода.

Можете ли вы придумать какое-либо альтернативное решение (а)?

Answer 1

Один из способов удалить темную тему - отредактировать variables.scssфайл и удалить это правило стиля:

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

Этот медиа-запрос - это тот, который изменяет все цвета настраиваемых свойств CSS, когда пользователи выбирают темную тему на устройстве.

Также обратите внимание на color-schemeметатег из index.htmlфайла:

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

Вы можете найти больше информации об этом в Ionic Docs.