I realize it can be tricky to understand what’s going on. I will update the documentation soon - but I need some rest first.
The basics is that you have some new theme variables, card-mod-{thing}
where thing
can be e.g. card
, row
, glance
… and that’s where you put what you’d earlier put in style:
.
It’s important that the variable values are strings, so the |
is absolutely vital.
E.g:
card-mod-card: |
ha-card {
background: red;
}
card-mod-row: |
:host {
background: blue;
}
Edit:
Oh! And card-mod now adds a class to every card depending on it’s type, and lets the user add more.
So e.g.
card-mod-card: |
ha-card {
background: purple;
}
ha-card.type-button {
background: teal;
}
ha-card.pink {
background: pink;
}
Would make all cards purple except buttons, which would be teal, and cards where the user has specified:
type: entities
class: pink
entities:
- light.bed_light
which would be pink.