thomasloven / lovelace-card-mod

🔹 Add CSS styles to (almost) any lovelace card
MIT License
1.05k stars 169 forks source link

Wait until hass initialized before merging card and theme styles #284

Open akomelj opened 1 year ago

akomelj commented 1 year ago

This pull request may fix issues described in #152 (in some cases).

I experienced similar behavior - styles not being applied after page refresh - on one of my dashboards. I suspect some race condition occurs when card-mod styles are being applied as styles are correctly applied on some of my dashboards and randomly on others.

Please note that I am using a custom card-mod theme and the missing styles are set globally in the theme.

I noticed that sometimes card-mod did not read value of CSS variable --card-mod-theme correctly when debugging the issue. Moving await hass() in front of getPropertyValue("--card-mod-theme") appears to block the app for just enough time that variable --card-mod-theme is being set and can be read by card-mod.

It is quite possible that this is not a definite fix for #152. await hass() call postpones variable read for a few ticks and this may suffice in my particular case - refreshing page now works in 100% of my cases. YMMV.

akomelj commented 7 months ago

Hi, maybe this will help. I might be spreading misinformation but it´s 100% consistent for me.

Unfortunately this does not work for me. I do not experience this behaviour with card-embedded styles; my beef is with global styles that are defined in custom Home Assistant theme.

Here - in my case - the problem is the missing value of --card-mod-theme CSS variable and the styles not being applied due to this.