Issue with displaying the right condition

Configuration
1

Hi guys,

I was wondering if you could assist me with the following card, i tried looking around
for answers, however i can’t tell what i’m doing wrong.

I’m trying to create a custom button card that will display 3 different pictures based
on the temperature value, however, my second condition states that once the
temperature is equal to or higher than 20, display picture B, if the temperature is
equal or higher than 24, display picture C. In my case, even if the temperature is
higher than 24, it’s still displaying picture B.

Would really appreciate it if you could point me in the right direction or enlighten me
with that i’m doing wrong.

type: custom:button-card
entity: sensor.fibaro_motion_sensor_temperature_measurement
name: Temperature
show_entity_picture: true
show_state: true
state:
  - entity_picture: /local/temperature-cold.png
    operator: '<'
    value: 18
    styles:
      card:
        - width: 150px
        - box-shadow: 0px 0px 10px 3px rgb(57, 255, 20)
    name: Cold?
  - entity_picture: /local/temperature-good.png
    operator: '>='
    value: 20
    styles:
      card:
        - width: 150px
        - box-shadow: 0px 0px 10px 3px rgb(57, 255, 20)
    name: It's ok
  - entity_picture: /local/temperature-hot.png
    operator: '>='
    value: 24
    styles:
      card:
        - width: 150px
        - box-shadow: 0px 0px 10px 3px rgb(253, 28, 3)
    name: It's pretty warm
2

From the docs:

The order of your elements in the state object matters. The first one which is true will match.

1 Like
3

Omg can’t believe i missed that, i’ve changed it around and it works perfectly now. Thank you so much.