Button komplett nach Zustand färben

[LotharF]

Moin, ich bräuchte mal einen kleinen Denkanstoß.
Ich hab mir mit der "Button-Card" einen Button gebastelt, der blinkt, wenn der Status (bei mir) off ist.
Dabei hat nicht nur das Symbolbild, sonder der geamte Button, je nach Zustand, eine unterschiedliche Farbe.
So erkenne ich gleich, ob meine Farage auf oder zu ist.
Das klappt super und der Code sieht so aus:

type: custom:button-card
entity: switch.sonoff_mini_garage_status
icon: mdi:home
color: auto
color_type: card
name: Garage
show_state: false
state:
  - value: 'off'
    name: GARAGE OFFEN
    color: red
    icon: mdi:alert
    styles:
      card:
        - animation: blink 2s ease infinite
  - value: 'on'
    name: GESCHLOSSEN
    color: rgb(30, 32, 33)
    icon: mdi:garage
tap_action:
  action: none
double_tap_action:
  action: call-service
  service: switch.turn_on
  target:
    entity_id: switch.sonoff_mini_garage_auf_zu
hold_action:
  action: none
styles:
  card:
    - height: 120px
    - font-size: 15px
    - font-weight: bold
    - color: |
        [[[
          if (entity.state == 'off') return 'blue';

Der Button fügt sich schön ein, wenn ich den "Dark Mode" an habe. Und blinkt rot, wenn die Garage auf ist.
Ist das Tablet aber im hellen Modus, habe ich da den duklen Button zwischen denandere, die sich hie automatisch anpassen.
Habt ihr eine Idee, wie man den Button so einstellt, dass er (wie die anderen Button) bei "on" keine komplette Buttonfarbe hat?
Die soll er nur komplett auf Rot ändern, wenn der Status bei mir off ist.

 

[Nival]

Habt ihr eine Idee, wie man den Button so einstellt, dass er (wie die anderen Button) bei "on" keine komplette Buttonfarbe hat?

Das color_type: card entfernen, das weist an, die komplette Karte zu färben.

Die soll er nur komplett auf Rot ändern, wenn der Status bei mir off ist.

Dann bei der animation ergänzen:

      card:
        - animation: blink 2s ease infinite
        - background-color: red

 

[LotharF]

Wow, cool. Danke für die Info. Klappt super.