I came across this issue myself with my own UI. Saw your thread here and the ticket on Github after that. Figured I’d share this with you, so you can stay up to date.
Hopefully someone knows a viable workaround, because it doesn’t look like the changes will be reverted !important variable is not a viable solution in this case btw.
I’ve been testing updating my UI to use the new lovelace Grid card in 0.118 - particularly for the smaller button groups. These have been fixed width up until now, which looked fine on my Android, but my partner’s iPhone cuts off the last icon.
The advantage is that you can adjust how many buttons you have per row, and any extra wrap below quite nicely. Had to use card-mod to set the width as CSS as % width within the button card didn’t work for me. I adjusted the width/height to 90% as this gave a nice gap between each for the shadows, and 6 buttons per row with these settings gives the closest match to the current styling
Edit: I think for the first problem I can use h1, h2 etc till h6 (so 6 lines). Which would not be enough for my setup. I’ll experiment and see what I can do. Though I really hope I can just delete the stylesheet someway… Thanks for the tip in any case!
Hi I wanted to know if there is the possibility of being able to change the color of an icon based on a certain value reached. For example, I would like the temperature icon green if the temperature is between 20 and 25 degrees, orange if the temperature is between 25 and 30 degrees and red if it is greater than 30 degrees. How can you create a condition within a card?
Hello and thanks for the suggestion I’m studying above, I wanted to tell you something strange despite having followed your guides on how to install “layout-card-griddier” I keep getting the message "Custom element doesn’t exist: layout-card-griddier . " if I use “layout-card” everything works. Can you help me? Thanks