Clooos / Bubble-Card

Bubble Card is a minimalist card collection for Home Assistant with a nice pop-up touch.
MIT License
2.02k stars 57 forks source link

how to have multiple state colors? #830

Open platini76 opened 1 month ago

platini76 commented 1 month ago

.bubble-sub-button-1 > ha-icon { color: ${hass.states['sensor.nuki_porta_bocchio_battery'].state > '50' ? 'green' : 'red'} !important; }

I want to have a state color for 50 to 100, one for 20 to 50 and one for 0 to 20 how to have them on this mod? thanks for help

petanque commented 1 month ago

This works for me:

color: ${hass.states['sensor.radiator_stue_battery'].state < 10 ? 'red' : (hass.states['sensor.radiator_stue_battery'].state <= 20 ? 'yellow' : 'green')} !important;

platini76 commented 1 month ago

are you shure that this can work? .bubble-icon { color: ${hass.states['lock.porta_fronte_bocchio_lock'].state === 'locked' ? 'lightred' : 'lightgreen'} !important; }
.bubble-sub-button-1 { .bubble-sub-button-1 > ha-icon { color: ${hass.states['sensor.porta_fronte_bocchio_batteria'].state < 10 ? 'red' : (hass.states['sensor.porta_fronte_bocchio_batteria'].state <= 20 ? 'yellow' : 'green')} !important; } ${icon.setAttribute("icon", hass.states['lock.porta_fronte_bocchio_lock'].state === 'locked' ? 'mdi:lock' : 'mdi:lock-open')}