Iron icon height / width not working anymore

Hi all,

I have some picture elements cards that show an overview of my home (downstairs, upstairs) which shows the lights, temp and who’s home or not. For example the following piece of code:

- entity: light.kitchen_spot_3
          type: state-icon
          icon: mdi:lightbulb
          style:
           left: 5%
           top: 28%
           --iron-icon-height: 20px
           --iron-icon-width: 20px

Previously the --iron-icon-height, was working perfectly and all my icons were the correct size as I wanted them to be. Since updating to 0.110.1/2 the icons are all their standard size unfortunately. So some icons are way too big, while others are way too small compared to before updating. Does anyone have any idea why this is happening?

Thanks!

1 Like

Use this instead:

--mdc-icon-size: 20px
4 Likes

I tried the fix suggested, but no change in my icon size

That is strange, for me it did the trick. I changed my code as follows:

- entity: light.kitchen_spot_3
          type: state-icon
          icon: mdi:lightbulb
          style:
           left: 5%
           top: 28%
           --mdc-icon-size: 20px

Are you sure the indentation for you is correct?

That did it perfectly. Thank you!