I would agree that combining card-mod with complex cards like button-card brings issues. A client machine should be fast to process a page quickly.
Yeah, but in his case the template is so complex that I wonder if it has rendered something and doesn’t just have errores in the console. 
I got lost at the first row of the entities card 
I apologize I didn’t realize that was a complicated ask
Actually, I am a bit confused with your post. You answered to a post of another person but addressed it to me with “simplicity is not the ask”, then described some own issue with flex-table-card. Or is it same card / issue? Update: yes, that person was talking about your long post in another thread, and attached a code with 1081 lines. Yes, not complicated at all ))
Regardless the issue was solved, the questions weren’t but the issue was - this is closed
That old chestnut 
Hello! I was hoping to get some help removing the border on a custom card, I found a bunch of examples on the post but I was unable to replicate them.
My code:
card_mod:
style:
media-source-image-card $: |
div#container {
background: none;
box-shadow: none;
border: none;
}
.type-custom-media-source-image-card {
background: none;
box-shadow: none;
border: none;
}
Any help would be appreciated!
Try this untested:
card_mod:
style:
$: |
div#container {
...
}
.: |
ha-card {
...
}
Thank you for the quick response, unfortunately it didn’t change anything.
it is in a conditional card if that provides more context. although I tried the same thing on that card as well to no effect
If a card with ha-card is placed inside a conditional card - using card-mod is same:
Suggest to check with Code Inspector for a proper path for your particular case.
Hello everyone,
I have a question regarding the use of card-mod.
I am trying to apply card-mod to an entities card.
I want to set the height of hui-generic-entity-row to 30px.
However, the details inside the entities card vary depending on the domain.
Is there an efficient way to write this code?
Here is my current card. Thank you
type: entities
entities:
- entity: binary_sensor.p1sc_hms_errors
name: HMS Errors
- entity: sensor.hms_error_code
name: Error Code
- entity: sensor.hms_error_title
name: Error Title
- entity: sensor.hms_error_wiki
name: Wiki
card_mod:
style: &entities_height
hui-toggle-entity-row:
$: |
hui-generic-entity-row {
height: 30px !important;
}
hui-sensor-entity-row:
$: |
hui-generic-entity-row {
height: 30px !important;
}
hui-simple-entity-row:
$: |
hui-generic-entity-row {
height: 30px !important;
}
multiple-entity-row:
$: |
hui-generic-entity-row {
height: 30px !important;
}
hui-number-entity-row:
$: |
hui-generic-entity-row {
height: 30px !important;
}
Try
card_mod:
style:
.card-content div:
:first-child $: |
hui-generic-entity-row {
...
}
Oh, my. Thank you for making it so easy. Works great.
If you don’t mind, can I ask one more question?
I think this structure could be modified efficiently, but is it possible? I’ve always used it this way.
style:
.card-content div:
:first-child $: |
hui-generic-entity-row {
height: 30px !important;
}
:first-child $ hui-generic-entity-row:
$: |
state-badge {
display: none
}
For that, suggest to check Readme, a difference is explained there.
OK I’ll do my best and read it again, thank you very much!
I proposed/PRed theme variables for badge icon size and badge font size and it got approved merged today in dev.
So I’m looking forward to use
–ha-icon-size-badge
–ha-font-size-badge
as soon this frontent version will be in HA and can remote theme card_mod and/or mod-card-card_mod then.
This one?
Thank you!
Yes. This is mine. Of course card-mod worked but the flickering was annoying every day.
FYI:
2 Likes