Entity card – change color if entity state is today

Configuration Frontend
1

Hi all,

I have entity card which shows next cycle of watering sensor.

image
image733×66 8.3 KB 

type: vertical-stack
cards:
  - type: entities
    entities:
      - entity: sensor.watering_1_next_cycle
        name: Watering next cycle

I would like to change color of this line (icon, name and remaining time) if sensor state value is today. I wanted to use:

    style: |
      :host {
        {% if states(' sensor.watering_1_next_cycle ') == '???today???' %}
          --paper-item-icon-color: #4169E1;
          color: #4169E1;

but I don’t want how to define ‘???today???’.

Thanks

2

What are the states for this sensor?

sensor.watering_1_next_cycle

Just do a comparison when this sensor is in the range you want.

If the sensor is in hours then the comparison would be anything less than 24.

3

The sensor shows date and time like: 2023-06-22T19:23:00+00:00

4

Try this (untested):

as_datetime(states(config.entity)).date() == now().date()
5

Thank you for your suggestion but I don’t know how to implement that into condition. I tried this but it doesn’t work:

type: vertical-stack
cards:
  - type: entities
    entities:
      - entity: sensor.watering_1_next_cycle
        name: Watering next cycle
        style: |
          :host {
            {% if states(sensor.watering_1_next_cycle') == now().date() %}
              --paper-item-icon-color: #4169E1;
              color: #4169E1;
          }
6

Typo, you forgot to add “'”.
And check again my code above, you are comparing different values.
And also you forgot to add “{% endif %}”

Try this:

  - entity: xxx
    card_mod:
      style: |
        :host {
          {% if as_datetime(states(config.entity)).date() == now().date() %}
            --paper-item-icon-color: xxxx;
            color: xxxx;
          {% endif %}
        }
7

Great. It works :smiley:
Thank you a lot. I can see now my mistakes.

1 Like
8

One more question, anyway. Sometimes it happens on my tablet (in Kiosk mode) that colors are not updated. I need to restart the HA app every time. I checked the HA app on my mobile, and the colors worked normally there. Any idea where the problem could be?
Thanks.