Как мне остановить темный режим от разрушения моей css - PullRequest
0 голосов
/ 07 февраля 2020

У меня есть сайт со стилем css. Когда я смотрю в определенных браузерах, когда темный режим включен, css абсолютно уничтожен, а цвета, которые изменились на моем сайте, выглядят абсолютно отвратительными. Как я могу предотвратить изменение моих css / colourschemes из-за темного режима?

Когда я открыл свой URL через ссылку, отправленную на WhatsApp на моем устройстве android браузер по умолчанию - Android 'inte * Приложение 1016 * автоматически перенастраивает CSS, потому что у меня активен темный режим. Если другие пользователи go перейдут на мою страницу и активируют темный режим, я бы предпочел, чтобы они увидели оригинальный стиль, а не измененную версию темного режима.

Я обнаружил, что вы можете использовать этот медиазапрос для установки css для темного режима: @media (prefers-color-scheme: dark) {. Я мог бы продублировать весь мой файл css, который в настоящее время имеет длину 3000 строк с темным и светлым, с тем же кодом в скобках, но это кажется бессмысленным. Есть ли другие методы, которые будут работать?

enter image description here

1 Ответ

0 голосов
/ 07 февраля 2020

Если я понял, вы хотите, чтобы пользователи видели так называемую светлую версию, даже если их браузер настроен на выбор темной. То, что я собираюсь предложить, далеко не идеально ... Я имею в виду, я бы не стал этого делать, но я думаю, это должно работать . Просто скопируйте и вставьте CSS, который вы написали под запросом @media (prefers-color-scheme: dark), и вручную измените то, что там не работает, без изменения кода вне его скобок. Пользователи должны видеть оригинальную облегченную версию вашего сайта независимо от того, что они выбрали в настройках браузера. TBH, я не знаю, почему вы хотите сделать это: идеальным подходом IMHO было бы предоставить как светлую, так и темную тему с запасным вариантом по умолчанию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...