OMG, I feel stupid now. I totally missed that arrow to show all the links . With that thread I can make something work for sure. Have to look at it tomorrow. Awesome job on all these threads explaining with examples . Posted this reply at the bottom by mistake.
In any case, the secondary _info is spaced correctly again in b3
Hello everyone. First of all, thank you for the great Card-mod thread. My advice is based on the horizon card and if possible the change of colors of the arc of the sun and the moon. thank you very much in advance.
1st post ā link at the bottom ā horizon-card
Thank you very much for such an accurate and quick response. The colors have already been modified. Another question if it is possible. Could the sun/moon icons be modified? and the line will be replaced by another graph? Thank you first of all.
Suggest to ask in the cardās repo.
not only that, Backup is brokenā¦
as for entities spying, check this broken longer line of state value:
and note the 11:27ā¦
Is it a custom card or smth standard?
Asking because do not have it.
Anyway, the last fix was not only for climate entities, it should process any āmultilineā states.
(still thinking that touching hui-generic-entity-row was a bad idea)
this is an entities card with a sensor datetime
type: entities
entities:
- entity: sensor.last_boot
format: datetime
on tight screens like an iPhone.
took the modding out for the entities card and the entity to make it clearer:
wrote up an issue here long wrapping state value taking too much space Ā· Issue #24009 Ā· home-assistant/frontend Ā· GitHub
yes the consequences are huge and not well thought through. Core cards (like above) and custom alikeā¦
Pre2025.2 and With the latest fix:
or narrowed:
Who will think about custom cardsā¦
Not the 1st time.
Again, as every release of HA this keeps on breaking the card-mod things: Introduce "Custom styles / Templates" section in core cards for much easier change of CSS/styling of cards (like bubble card) - #3 by stefan1982
Please vote for this, as this will also make YOUR life easier once you could simply alter the CSS of a card in the card styling section itself.
This way, things keeps breaking, but makes things a lot easier to directly go to the CSS-section that needs attention to fix it.
this will never happen in core I am afraid. theyāre simpling frontend down, and adding css will be the contrary.
what is the link for the frontend discussion?
you should add it also to that FR, because now no-one will see it
The last card-mod thing which was broken by HA was ārenderEntityā.
Other changes in HA frontend are not about ābreaking card-modā - they are merely about āchanging frontendā which is NORMAL. Users should not expect that their card-mod customizations will work forever.
Of course some changes in frontend are not ālife criticalā but break customizations, custom cards etc (as I already said above, that initial fix for generic-entity-row was absolutely not necessary; it makes the row nicer since the row has larger active areas - but may break some customizations & custom cardsā¦).
yeah, and btw, there would be no difference, because when ātheyā change the frontend, you would still have to adjust your css in the card, just as you need to do now.
I was hoping to get some help with a selector. It seems that selecting something in shadow root doesnāt really work for me. Hereās where I started to see if this would even work.
views:
- title: Wall Panel
path: kiosk
type: custom:ha-dashboard
card_mod:
style: |
ha-card {
border-style: unset;
border-radius: 0;
background: rgba(255,255,255, 0.5) !important;
margin: 0 !important;
flex-basis: 35% !important;
}
hui-masonry-view {
background: white !important;
}
The above modification to the background of hui-masonry-view works perfectly fine.
So, knowing that I can successfully select hui-masonry-view and modify that I assumed that I would be able to select child elements of hui-masonry-view as well. Hereās what Iām trying to select:
I want to be able to select the <div class="column"
and hereās all the things I tried to do that
Attempt #1
hui-masonry-view$#columns>div {
background: white !important;
}
Attempt #2
hui-masonry-view$: |
#columns>div {
background: white !important;
}
Attempt #3
hui-masonry-view$: |
#columns: |
div {
background: white !important;
}
Attempt #4
hui-masonry-view
$: |
#columns: |
div {
background: white !important;
}
Attempt #5
"hui-masonry-view $ #columns": |
div {
background: white !important;
}
Nothing seems to work at all. If anyone has any suggestions Iād really appreciate it.
Thank you!
Not using this card, but:
- This is a wrong code, should be like āhui-masonry-view {ā w/o a colon.
- ā# this worksā is a wrong way in card-mod since you are trying to use ā#ā inside a string. Use ā/* this works */ā instead.
What is this?
Thanks, I edited to fix the mistake. However, that part of the code was working perfectly fine that wasnāt really my question. My question was more so how to select child elements underneath of hui-masonry-view. Since I can modify hui-masonry-view my assumption was that selectors of stuff underneath of it would also work but it seems it does not.