Clooos
Light Entity Icon Color
Describe the bug
The icon color of light entities is hard coded in the card when the light is on, instead of using variables. Additionally, the icon background is handled in a way that makes the icon hard to see when using a light theme and --ha-card-background is close to white.
To Reproduce
Steps to reproduce the behavior:
- Use a theme with a light mode (the default Home Assistant theme works)
- Create a bubble card for a light
- Turn the light on
Expected behavior
The icon should respect the --state-light-active-color variable. I think the fallback order the tile card uses is --state-light-on-color -> --state-light-active-color -> --state-active-color.
Handle the color of the icon background so that the icon is more visible
Screenshots
Current state:
Tile card example:
Informations (please complete the following information):
- OS: macOS/Windows 11/Android 14
- Browser/App: Firefox/HA Android app
- Bubble Card version: 2.1.1
- Home Assistant version: 2024.7.4
Thank you! 🍻
+1. Also, the Card background doesn’t always reflect the actual Light colour, so this can be confusing and unreadable at times.
Same here - noticing that in styling sub buttons can't get the state active color
Hi! I've added this issue to my to-do list. I'm working on a really complex issue (the editor slowness on some configs) but I hope it will be fixed soon so that I can move on to other ones 🤞
@Clooos Sorry for nudge, but could this annoying issue be prioritised higher please? thanks
Wow, I guess that this one will be my priority indeed, sorry for that everyone! I will do my best to fix that in the next release!
You're amazing, I have rarely seen a developer who is so reactive. What you did is already fantastic!!! Thank you again
Here what a white light slider will looks like in the next release on a light theme, what do you think everyone?
And I'm sorry again, I don't use a light theme, that's why I forgot about that one 😅
Hi, I think it looks good indeed, but why not the full orange, like the others? On the picture below, even on a dark theme, why not the same color for lights and other sliders?
Hi, I think it looks good indeed, but why not the full orange, like the others? On the picture below, even on a dark theme, why not the same color for lights and other sliders?
This! I would also use the same orange tint
@biva @DavidinoX don't you think that it is best to differentiate lights to other entities?
I think we should start a poll here, it's a serious breaking change for everyone who is used to the previous color 😅
Tell me your opinion everyone 🙂
Personally, it's not important to me that lights and slider entities are the same color, especially if it's a major, branding change.
I like it, especially if the background color matches the theme.
Ultimately if this is the default this is perfect, and if you could leverage the variables mentioned above to override if you wanted to, even more perfect!
I've already added variables that can be edited directly in the theme, this way it will be really easy to replace the color I've defined. I will let it like that then 🙂
Once the v2.3.0 will be over, I will document every available variables 👌
The new beta is here, and it should looks way better on light/bright themes! 🤞
https://github.com/Clooos/Bubble-Card/releases/tag/v2.3.0-beta.8
The new beta is here, and it should looks way better on light/bright themes! 🤞
https://github.com/Clooos/Bubble-Card/releases/tag/v2.3.0-beta.8
Thanks, that fixed icon being visible. However light state colour still isn't reflected, and has become much worse.
Bubble Button Switch:
Actual light temperature:
Well indeed, the issue here is that if I set it to the real color, the text inside the cards will not be visible anymore. But I can indeed change that default color to something less warm.
Well indeed, the issue here is that if I set it to the real color, the text inside the cards will not be visible anymore. But I can indeed change that default color to something less warm.
Text still looks visible to me using the same colour. I see the default background opacity is 0.5 if I'm not mistaken, maybe reduce it for more whiter hues, or use text/box shadows that are adaptable? Another possible option, is for a toggle to enable background gradient like for media_player but for lights, however I believe you're not a fan of it.
I will change this, this was a mistake, I wanted to only change that for light themes. I will change that in the next release.
This should now be perfect on both light and dark themes. To install this version, you need to remove Bubble Card from HACS first, then install it with the "Without HACS" method. Once installed, don't forget to clear your cache.
Hello, I updated to the latest version but all bubbles (icon and background) are grey by default
I don't have this issue, here's how it looks on mine with a light theme and some lights that are turned on.
For the record, downgrading to beta-8 changes colors to this. Sub buttons colors are still weird. Might be some other plugin conflicting? I have no idea 😔😔