Ionic'te koyu temayı devre dışı bırakın

Sep 08 2020

İyonik bir uygulama tasarlıyorum ve kullanıcının karanlık temayı etkinleştirmiş olup olmadığına bakılmaksızın beyaz arka planlara ve siyah metinlere sahip olmasını istiyorum .

İstediğim bu:

Ancak, bir Android telefonda koyu temayı etkinleştirdiğimde, otomatik olarak buna dönüştürülür:

Bunun olmasını önlemek istiyorum. İnternette arama yaptım ve karanlık temanın nasıl uygulanacağını açıklayan birçok makale buldum , ancak devre dışı bırakma konusunda hiçbir şey bulamadım.

Düşündüğüm bir çözüm, koyu temayı açıkça etkinleştirmek ve ardından koyu tema için açık temayla aynı renkleri ayarlamak. Bununla birlikte, çok fazla gereksiz kod yazmayı içerdiğinden, bu yaklaşımın istenmeyen olabileceğini düşünüyorum.

Herhangi bir alternatif çözüm düşünebiliyor musunuz?

Yanıtlar

4 sebaferreras Sep 08 2020 at 20:10

Koyu temayı kaldırmanın bir yolu, variables.scssdosyayı düzenlemek ve bu stil kuralını kaldırmaktır:

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

Bu medya sorgusu, kullanıcılar cihazdaki koyu temayı seçtiğinde CSS özel özelliklerinin tüm renklerini değiştiren sorundur.

Lütfen ayrıca dosyadaki color-schememeta etikete bir göz atın index.html:

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

Ionic Docs'ta bununla ilgili daha fazla bilgi bulabilirsiniz.