home-assistant-custom-ui: icon_color don‘t work anymore with ha 0.110

Checklist

[ x] I’m running the latest version of CustomUI (Update guide) or using a specific release that is not marked as “Broken”.
[x ] I tried to force-refresh (Ctrl+Shift+R / Ctrl+F5) the browser
[ x] (Optional, but recommended) I’m using Chrome or tried to reproduce the feature on Chrome.

Browser + Version: Safari, Chrome

CustomUI version:

20190518

Home Assistant release (hass --version): 0.110.0b0 Problem-relevant configuration.yaml entries:


  icon_color: >
    if (state === 'on') return '#FF0000';
    if (state === 'off') return '#00FF00';
    return icon_color;

Problem-relevant Home Assistant log entries:

Any errors from browser Javascript console:

About this issue

Original URL
State: open
Created 4 years ago
Comments: 19

Most upvoted comments

this is now solved, Ive created a PR, but the fix is explained here: home-assistant/frontend#5892 (comment) hurray!

I have tried to replace my state-card-custom-ui.html with the one in your branch but the icon_color is still not functioning correctly. Do i need to do anything else other than replace the file with the edited one and clear the cache on my browsers ? Thanks for taking this on, you are right that without the ability to apply colours to icons and other Custom UI tricks the frontend is a little bland.

I have resolved my issue. I removed all files from www/custom_ui and only left the modified version of state-card-custom-ui.html and state-card-custom-ui-es5.html this seems to have resolved my issues and i now have icon_color working as it should on 0.110.0 thanks all.

smith844 on May 21, 2020

I did the exact same thing before, asked to do so by Thomas, (see link) and kept receiving errors in inspector about this https://github.com/home-assistant/frontend/issues/6028#issuecomment-633531546 will test again, because that would really be the best future-proof solution.

Nope:

and proof it loaded the correct file:

Are you sure your cache isn’t still loading (took more than a few restarts in my setup to get the edited custom-ui card to work…)

btw you’re missing a step 1a2: comment the configuration section in configuration.yaml… need to do that before restart…

edit

duh, I had tested with the old version html before my own edits…

works now indeed, so thanks for reminding me to try again 😉 !

see here for more info: https://github.com/home-assistant/frontend/issues/6028#issuecomment-634502064

Mariusthvdb on May 27, 2020

Making the changes in 5892 and 6028 fixed everything for me

Steps: 1 - Delete everything into the folder \config\www\custom_ui 1a- RESTART your HA 2 - Create a new file named state-card-custom-ui.js into the folder \config\www\custom_ui 3 - Copy state-card-custom-ui.html into your state-card-custom-ui.js 4 - Delete the first line <script>/*! For license information please see scripts.js.LICENSE */ 5 - Delete </script> on the last line 6 - Change you configuration.yaml

frontend:
  extra_module_url:
    - /local/custom_ui/state-card-custom-ui.js

7 - RESTART your HA 8 - Icons should be working

EDIT - Just tried it on my second HA installation and works flawlessly too

SupremeSports on May 27, 2020

this is now solved, Ive created a PR, but the fix is explained here: home-assistant/frontend#5892 (comment) hurray!

I have tried to replace my state-card-custom-ui.html with the one in your branch but the icon_color is still not functioning correctly. Do i need to do anything else other than replace the file with the edited one and clear the cache on my browsers ? Thanks for taking this on, you are right that without the ability to apply colours to icons and other Custom UI tricks the frontend is a little bland.

I have resolved my issue. I removed all files from www/custom_ui and only left the modified version of state-card-custom-ui.html and state-card-custom-ui-es5.html this seems to have resolved my issues and i now have icon_color working as it should on 0.110.0 thanks all.

0.110.1 is ok

thanks all.

ybist on May 23, 2020

this is now solved, Ive created a PR, but the fix is explained here: home-assistant/frontend#5892 (comment)

hurray!

I have tried to replace my state-card-custom-ui.html with the one in your branch but the icon_color is still not functioning correctly. Do i need to do anything else other than replace the file with the edited one and clear the cache on my browsers ? Thanks for taking this on, you are right that without the ability to apply colours to icons and other Custom UI tricks the frontend is a little bland.

smith844 on May 20, 2020