Basic Custom-UI Icon Color Change Issue

Configuration Frontend
1

I recently install Custom-UI and can do a basic icon color change without issue so I know it’s working. But now I’m trying to change the color of an icon based on whether two version sensors match or not. After reading a number of posts regarding similar actions, I still can’t seem to figure out exactly how to compare the sensors. I’ve tried a number of variations of this sort of thing, but none of them seem to work:

  sensor.current_version:
    icon_color: salmon
  sensor.latest_version:
    templates:
      icon_color: if (state === sensor.current_version.state) return 'green'; else return 'red';

# Have also tried...
state === states.sensor.current_version.state
state === hass.states.get(sensor.current_version)

Can you not do a simple state comparison with customize.yaml?

2

Try.

  sensor.window_bedroom:
      templates:
        hs_color: >
          if (state === 'Open') return [0,100,50];
          return [120,100,19];
3

I’m sorry, I don’t see how this relates to my question. I’m able to do a basic icon color change based on the state of the sensor, but what I’m trying to do is change it based on whether it is equal to the state of a second sensor.

1 Like
4

Here’s an example from my customize.yaml:

script.disarm_alarm:
  templates:
    icon_color: if (entities['sensor.armed_status'].state === 'disarmed') return 'green'; else return '#696969';
2 Likes
5

Thank you, this is the syntax that I was looking for. From this I’ve come up with the following that works:

  sensor.latest_version:
    templates:
      icon_color: if (entities['sensor.latest_version'].state === entities['sensor.current_version'].state) return 'green'; else return 'red';
1 Like
6

Glad to help. Looking at it, it’s not something that I would have just come up with on my own. I’m sure I stole it from someone else :slight_smile:.

7

I think there’s a lot of us that are “learning by stealing”! It’s nice that there’s such a good community of people willing to help us newbies. Perhaps at some point I’ll be able to help others as well.

So now that I got this working I figured I’d try something similar for my SSL certificate expiration. Unfortunately that’s not working and I’m not seeing any errors.

  sensor.ssl_cert_expiry:
    templates:
      icon_color: >
        if (entities['sensor.ssl_cert_expiry'].state < 20)
          return 'red';
        else if (entities['sensor.ssl_cert_expiry'].state < 30)
          return 'yellow';
        else
          return 'green';
8

If you’re just checking the state of the item that you’re modifying, you can do it like this:

sensor.mbath_water_temp:
  friendly_name: Water Temp
  templates:
    hs_color: if (state < 95) return [240,100]; else return [0,100];
    brightness: return 100;

I don’t have any multi-line customizations, but it should work. Maybe something to experiment with, though.

1 Like
9

I guess that makes sense being you’re only dealing with the current sensor and not comparing it to something else. Once I changed it it started to work:

  sensor.ssl_cert_expiry:
    templates:
      icon_color: >
        if (state < 20)
          return 'red';
        else if (state < 30)
          return 'yellow';
        else
          return 'green';

Thank you.

10

Glad it’s working, but I wonder why the other way didn’t work. That’s something that I would obsess over, but feel free to move on :).

11

I might obsess over it as well, but I am moving on and just accepting it for now. I’m just trying to cover a lot of ground and learn at the same time.