Ich dachte, es ist ganz einfach mit card-mod aber dann mußte ich doch probieren und bin am Ende bei Button Card gelandet. Button Card hat mehr Möglichkeiten als card-mod.
Hier der Code: Du kannst Größe, Icon, Schrift, Farbe anpassen.
type: custom:button-card
entity: binary_sensor.xxx_occupancy
name: Bewegungsmelder
show_state: false
variables:
BewegungErkannt: >
[[[ return
states['binary_sensor.xxx_occupancy'].state ===
'on'; ]]]
styles:
card:
- background-color: |
[[[ return variables.BewegungErkannt ? 'red' : 'inherit'; ]]]
icon:
- color: |
[[[ return variables.BewegungErkannt ? 'white' : 'inherit'; ]]]
- width: 50px
- height: 50px
name:
- color: |
[[[ return variables.BewegungErkannt ? 'white' : 'inherit'; ]]]
- font-size: 20px
- font-weight: bold
grid:
- grid-template-areas: '"i" "n"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr auto
Es geht aber wegen der Wartbarkeit würde ich es eher anders machen, siehe dieses Beispiel. Am Ende ist es aber Geschmackssache.
Viel Spaß