Kart Stili

Dreame Vacuum Kartı, Home Assistant'ın varsayılan temasıyla doğal olarak uyumludur. Tüm dahili bileşenler, menüler ve düzenler otomatik olarak aktif Home Assistant temasına uyum sağlar. Hem Light hem de Dark mod renklerini dinamik olarak sorunsuz bir şekilde devralır, bu da standart koşullar altında özel stil vermeyi gereksiz kılar.

Estetiği özelleştirmek için özel bir Home Assistant teması oluşturmak, aşağıda listelenen harici CSS özelliklerini geçersiz kılmayı gerektirir.

Harita Stilleri

Bu ayarlar yalnızca kartın UI bileşenlerini etkiler. Odalar, yollar ve duvarlar gibi vakum haritasının iç renklerini özelleştirmek Renkleri Geçersiz Kıl bölümünde yapılır.

Kart aynı zamanda --dvc- ile başlayan dahili ayarları kullanır. Dahili ayarları doğrudan geçersiz kılmak önerilmez, çünkü davranışları gelecekteki güncellemelerde değişebilir. Bunun yerine aşağıda listelenen harici Home Assistant tema ayarlarını hedefleyin.

card-mod

card-mod eklentisi, kararlılığı sağlamak için bu kartta açıkça devre dışı bırakılmış ve desteklenmemektedir. Sayfada sağlanan CSS özelliklerini geçersiz kılmak için özel Home Assistant temaları kullanılmalıdır.

Belirli bir görsel değişiklik temalar aracılığıyla gerçekleştirilemiyorsa, istenen değişiklikleri ve bunların gerekçesini açıklayan bir özellik talebi Sorun Raporlama sayfası üzerinden gönderilebilir.

Arka Planlar ve Sınırlar

Bu ayarlar, kartın ana yapısal görünümünü kontrol eder.

Değişken	Açıklama
--ha-card-background	Kartın ana arka plan rengini tanımlar.
--secondary-background-color	İkincil yüzeyler, üst üste binen arka planlar ve kayan menüler için kullanılır.
--view-background	Kontrol panelinin temel arka plan rengi. Kart, sorunsuz bir şekilde karışmak için panel veya picture modundayken bunu kullanır.
--ha-card-border-radius	Kartın dış köşelerinin yuvarlaklığını tanımlar.
--ha-card-border-width	Kartın sınır çizgisinin genişliği.
--ha-card-border-color	Kart sınırının rengi.
--divider-color	İç liste bölücülerinin ve ayırıcılarının rengi.
--ha-card-box-shadow	Ana kart konteynerine uygulanan kutu gölgesi.
--ha-card-backdrop-filter	Kart arka planına blur gibi arka plan filtreleri eklemeye izin verir.

Metin & Tipografi

Bu ayarlar, kullanıcı arayüzünde kullanılan metin renklerini belirler.

Değişken	Açıklama
--primary-text-color	Birincil başlıklar, durum metinleri ve değerler için kullanılan ana metin rengi.
--secondary-text-color	İkincil metinler, detaylı durumlar ve pasif sekme etiketleri için kullanılır.
--disabled-text-color	Şu anda kullanılamayan veya devre dışı bırakılmış metin için kullanılan renk.
--text-primary-color	Birincil renkli düğmelerin üzerinde doğrudan yer alan metnin rengi.

Simge ve Vurgular

Bu ayarlar, etkileşimli öğelerin, aktif durumların ve simgelerin renklerini yönetir.

Değişken	Açıklama
--primary-color	Aktif öğeler, düğmeler, yükleyici animasyonları ve seçili sekmeler için birincil vurgu rengi.
--light-primary-color	Birincil rengin daha açık bir versiyonu, fare üzerine gelme durumu veya aktif düğme arka planları için kullanılır.
--accent-color	Kullanıcı arayüzündeki belirli vurgular için kullanılan alternatif vurgu rengi.
--mdc-theme-on-primary	Birincil renkli bir arka planın üzerinde yer alan metin veya simgelerin rengi.
--paper-item-icon-color	Durum ve menü simgeleri için varsayılan renk.
--paper-item-icon-active-color	İkonlara, ilgili durumları aktif olduğunda uygulanan renk.

Durum ve Semantik Renkler

Kart, vakumun durumuna ve aktif bildirimlere göre dinamik olarak renk değiştirir.

Değişken	Açıklama
--success-color	Başarılı işlemler veya tam şarj gibi olumlu durumlar için kullanılır.
--info-color	Bilgilendirici öğeler ve standart uyarılar için kullanılır.
--warning-color	Uyarı bildirimleri, düşük pil durumu veya küçük sorunlar için kullanılır.
--error-color	Kritik arızalar, hatalar ve geçilemeyen harita nesneleri için kullanılır.
--state-unavailable-color	Vakumun şu anda kullanılamadığını veya çevrimdışı olduğunu gösteren renk.

Etkileşimli Öğeler

Düğmeler, kaydırma çubukları ve girişler gibi UI bileşenlerini hedefleyen tema ayarları.

Değişken	Açıklama
--mdc-theme-surface	Açılır menüler, dropdownlar ve açılır kartlar için yüzey rengi.
--mdc-button-raised-box-shadow	Yükseltilmiş düğmelere derinlik vermek için uygulanan gölge.
--input-hover-line-color	Belirli giriş alanlarının üzerine gelindiğinde alt çizginin rengi.
--input-dropdown-icon-color	Dropdown menülerindeki imleç/ok ikonlarının rengi.
--scrollbar-thumb-color	Uzaktan kumanda joystick ve kaydırma çubukları için kullanılan renk.
--rgb-primary-color	Ana rengin RGB virgülle ayrılmış versiyonu, alfa saydamlığı uygulamak için kullanılır.
--rgb-primary-text-color	Ana metin renginin RGB virgülle ayrılmış versiyonu, alfa saydamlığı uygulamak için kullanılır.