Custom shutter-card gestalten

Hallo,

mit dieser, mehr oder weniger Standard-Stapelkarte

type: vertical-stack
title: Beschattung
cards:
  - type: horizontal-stack
    cards:
      - type: custom:shutter-card
        title: Gartenseite
        entities:
          - entity: cover.terrasselinks
            name: Terrasse Li
            buttons_position: left
            title_position: bottom
            always_percentage: true
      - type: horizontal-stack
        cards:
          - type: custom:shutter-card
            title: Gartenseite
            entities:
              - entity: cover.terrasserechts
                name: Terrasse Re
                buttons_position: left
                title_position: bottom
                always_percentage: true
...

lasse ich mir die Shutter-Cards anzeigen. Nun möchte ich mittels

card_mod:
  style: |
    ha-card {  

die Karten einzeln im Layout Abschnitte stylen (bspw. box-shadow). Leider bekomme ich bisher nur Fehlermeldungen. Kann mir jemand dabei Hilfestellung geben?

Vielen Dank im Voraus.

1 „Gefällt mir“

Ich nutze die Card nicht, daher kann ich es dir nur so zeigen, ohne weiteren Test. Du musst den Card Mod direkt unter der jeweiligen shutter-card einfügen und kannst dann Border (Rand) und Shadow (Boxschatten) einstellen.

type: vertical-stack
title: Beschattung
cards:
  - type: horizontal-stack
    cards:
      - type: custom:shutter-card
        title: Gartenseite
        entities:
          - entity: cover.terrasselinks
            name: Terrasse Li
            buttons_position: left
            title_position: bottom
            always_percentage: true
        card_mod:
          style: |
            ha-card {
              box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
              border: 1px solid var(--primary-color);
              border-radius: 10px;
            }
      - type: custom:shutter-card
        title: Gartenseite
        entities:
          - entity: cover.terrasserechts
            name: Terrasse Re
            buttons_position: left
            title_position: bottom
            always_percentage: true
        card_mod:
          style: |
            ha-card {
              box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
              border: 1px solid var(--accent-color);
              border-radius: 10px;
            }

2 „Gefällt mir“

Super, das funktioniert so - vielen Dank noch einmal!!!

1 „Gefällt mir“