У нас есть приложение электронной коммерции, которое отправляет детали заказа при совершении покупки, и мы только что переработали этот шаблон электронной почты. За последние несколько дней мы получили сообщения о том, что у некоторых клиентов половина текста пропущена.
Наконец, получив скриншот, мы узнали, что проблема возникает на iPhone в темном режиме. До сих пор все они были клиентами, использующими gmail либо с приложением Mail, либо с Safari (у обоих одинаковые проблемы). Я не уверен, имеет ли значение фактор gmail или совпадение.
Наша электронная почта проста - она имеет белый фон, серые заголовки и черный текст. Темный режим оставляет белый фон и серые заголовки нетронутыми, но основной текст меняется с черного на белый. На белом фоне белый текст явно невидим, а в электронном письме отсутствует большое количество контента.
Можно ли что-нибудь сделать, чтобы темный режим не изменил наш текст с черного на белый?
Я должен отметить, что у нас также есть QR-код, встроенный в электронное письмо, поэтому я обеспокоен решениями, которые позволили бы темному режиму продолжать перекрашивать нашу полную электронную почту, поскольку я считаю, что это затруднит распознавание QR-кода. ,
Изменить: это не относится ни к какому коду приложения, поэтому рекомендации по разработке iOS для темного режима не применяются. Это просто вопрос того, как приложение Apple Mail на iOS 13 в темном режиме отображает электронную почту в формате HTML.
color-scheme: light only
для всех элементов. Огромное спасибо.Ответы:
Вы можете принудительно удалить это на устройствах Apple, но теперь у нас есть Gmail и Outlook на Mac без возможности их остановить.
Проще говоря это в
<head>
:«Только» - это сокращение от «Только свет» (которое также работает).
Это исправит темный режим iPhone и Apple Mail, но не Outlook на Mac или Gmail.
В настоящее время вы можете переопределить Outlook на Mac, но Gmail не известен.
Вот как переопределить для Outlook на Mac:
HT для Брайана Тиса на форуме Litmus для этого
Но лучше попытаться исправить проблему с корнем, а не удалять функциональность (темный режим), которую хотят ваши клиенты.
Apple предоставили такой способ, с этим в
<head>
:Также убедитесь, что ваш самый внешний элемент с background-color имеет класс "darkmode", например
По умолчанию у вас будет белый фон, черный текст; и в темном режиме это будет темный фон со светлым текстом.
(Пожалуйста, предоставьте код для любых дальнейших запросов.)
источник
Благодаря ссылке, предоставленной @FrankSchlegel
https://webkit.org/blog/8840/dark-mode-support-in-webkit/
Использование
color-scheme: light only
в CSS на всех элементах было ответом. Спасибо!источник