I’ve been searching a while to found an example performing icon color change in Glance-Card based on the states of sensor
I’ve an Shelly 1PM connected to an radiator
I’ve an Xiaomi window sensor to cut the power of the radiator when window is opened
Using HACS card-mod plugin and ShellyForHass intégration
I was looking to change the color of the window sensor, green when window open, standard color otherwise.
For the radiator, grey when the Shelly relay is off, standard color if relay if on but radiator off and red if radiator is powered.
I was also looking to change the radiator icon from mdi:radiator-disabled to mdi:radiator when heating is on but this is not possible yet I think.
This is my Glance-card configuration
- entity: binary_sensor.xdw_br11_window
name: Fenêtre
style: |
:host {
--iron-icon-fill-color:
{% if is_state('binary_sensor.xdw_br11_window', 'on') %}
rgb(0, 204, 102)
{% else %}
rgb(68, 115, 158)
{% endif %}
;
}
- entity: switch.shelly_shsw_pm_766afc
name: Prise
icon: 'mdi:radiator-disabled'
style: |
:host {
--iron-icon-fill-color:
{% if is_state('switch.shelly_shsw_pm_766afc', 'off') %}
grey
{% elif states.sensor.shelly_shsw_pm_766afc_current_consumption.state | int > 10 %}
red
{% else %}
rgb(68, 115, 158)
{% endif %}
;
}
- entity: sensor.shelly_shsw_pm_766afc_current_consumption
name: Chauffage
style: |
:host {
--iron-icon-fill-color: rgb(255, 153, 102)
}