Change card color based on Google travel time

Configuration Frontend
1

Hello :slight_smile:

I have a dashboard with a card for the travel time to my work. I would like the text on that card to change color, depending on the travel time. (e.g. if travel time is above 40 minutes, make the text red).

I came up with the following code, but the text is always green. In other words, there is something wrong with the if-statement. I don’t know how to read the value in the variable to debug, so I have no clue how to solve it.

Does anyone have any pointers? :slight_smile: thank you in advance for your help!!

      - type: entity
        entity: sensor.google_travel_time
        name: Travel to work
        style: |
          ha-card {
            color: 
              {% set drive_time = states('sensor.google_travel_time') | float / 60 %}
              {% if drive_time > 40 %}
                red
              {% else %}
                green
              {% endif %}
              ;
          }
2

Try using a more proper way:

card_mod:
  style: |
    ha-card {
      {% if ... %}
      color: red;
      {% else %}
      color: green;
      {% endif %}
    }
3

thank you for the tip. I cleaned it up, but unfortunately it didn’t change the outcome… still always shows green.

4

Then paste your template into Dev tools → Template and check

5

I found it! For some stupid reason I did “/60” behind the float, which was just old code. DUH! Just removed that and it worked :slight_smile:

Thank you for the support :slight_smile:

here is the final working code for whoever needs it in the future:

      - type: entity
        entity: sensor.google_travel_time
        icon: mdi:car-hatchback
        name: Travel to work
        style: |
          ha-card {
            {% set drive_time = states('sensor.google_travel_time') | float %}
            {% if drive_time > 35 %}
              color: red;
            {% else %}
              color: green;
            {% endif %}
          }
6

Planning your RV travels just got easier! At MR RV Expert, we appreciate the importance of a seamless journey. To enhance your RV experience, explore our website for expert tips on optimizing travel routes, luxury customization, and timely alerts. Our goal is to make your RV adventures stress-free and enjoyable. Dive into a world where expertise meets exploration, and let Mr RV Expert be your guide to unlocking the full potential of your RV lifestyle. Safe travels and happy adventures!