Closed Nerwyn closed 6 months ago
Duplicate (but better) of #290
Try
.:
ha-tabs:
...etc...
paper-tabs:
...etc...
Placing the selectors in .:
breaks the card-mod theme, BUT it looks like the other changes and improvements you made in 3.4.0 fixed this with no changes to my theme needed!
Is there any way to make it so that card-mod within themes reloads if the HTML on the page changes? Some elements unload and reload or load late, and the card-mod theme CSS does not apply if the element is not present on initial page load.
Context: I've started using card-mod as part of my theme to transform the navbar from a header to a footer and make some other stylistic changes. While this works great it does break when I enter or exit edit dashboard mode.
How it looks with card-mod theming normally:
After entering edit mode:![image](https://github.com/thomasloven/lovelace-card-mod/assets/43071698/b5f79532-9a3f-4c26-af5a-9938e478c1b0)
And after exiting edit mode:
The reason for this is that the HTML around the navbar changes from
ha-tabs
:to
paper-tabs
:While I was able to repeat the CSS for evenly spacing the icons for both of these, because entering and editing edit mode causes the HTML of the page to change it the card-mod theme CSS doesn't apply until the page is refreshed. Relevant card-mod CSS for reference:
The
frontend.reload_themes
service also fixes the CSS for new HTML elements. Is there any way to make it so that either the card-mod theme CSS is reloaded if the page HTML changes, orfrontend.reload_themes
is called? Alternatively is there a way to detect and automate callingfrontend.reload_themes
if any user enters or exits edit mode?