Border CSS

Entraide Home Assistant
1

Bonjour,

En attente de recevoir mes sensor température, je suis en train de préparer ma carte. Voici ce que je compte faire

type: custom:stack-in-card
title: Méteo
cards:
  - type: horizontal-stack
    cards:
      - type: weather-forecast
        entity: weather.nantes
  - type: horizontal-stack
    cards:
      - type: horizontal-stack
        cards:
          - type: horizontal-stack
            cards:
              - type: vertical-stack
                cards:
                  - type: entities
                    entities:
                      - entity: sensor.time
                  - type: entities
                    entities:
                      - entity: sensor.time
              - type: horizontal-stack
                cards:
                  - type: entities
                    entities:
                      - entity: sensor.time
                      - entity: sensor.time
                  - type: entities
                    entities:
                      - entity: sensor.time
                      - entity: sensor.time

Ne tenez pas compte des entités j’ai mis ceux la juste pour exemple.

Capture d’écran 2025-01-29 à 16.00.28
Capture d’écran 2025-01-29 à 16.00.281740×724 29.3 KB

Je voudrais supprimer les border. Pour cela j’ai fait un petit test avec l’inspecteur du navigateur et il faudrait pour cela que je mette un border à zéro sur ha-card.

Capture d’écran 2025-01-29 à 16.02.56
Capture d’écran 2025-01-29 à 16.02.561920×1116 142 KB

Mais comment le faire sur mon code ?

2

Hello,

A mon avis tu vas devoir passer par card_mod

essaye ça

type: custom:stack-in-card
title: Méteo
cards:
  - type: horizontal-stack
    cards:
      - type: weather-forecast
        entity: weather.nantes
        card_mod:
          style: |
            ha-card {
              border: none;
              box-shadow: none;
            }
  - type: horizontal-stack
    cards:
      - type: horizontal-stack
        cards:
          - type: horizontal-stack
            cards:
              - type: vertical-stack
                cards:
                  - type: entities
                    entities:
                      - entity: sensor.time
                    card_mod:
                      style: |
                        ha-card {
                          border: none;
                          box-shadow: none;
                        }
                  - type: entities
                    entities:
                      - entity: sensor.time
                    card_mod:
                      style: |
                        ha-card {
                          border: none;
                          box-shadow: none;
                        }
              - type: horizontal-stack
                cards:
                  - type: entities
                    entities:
                      - entity: sensor.time
                      - entity: sensor.time
                    card_mod:
                      style: |
                        ha-card {
                          border: none;
                          box-shadow: none;
                        }
                  - type: entities
                    entities:
                      - entity: sensor.time
                      - entity: sensor.time
                    card_mod:
                      style: |
                        ha-card {
                          border: none;
                          box-shadow: none;
                        }

et vois d’autres avis
cdt

3

Bonjour,
tu peux te faire un thème et supprimer définitivement les bordures, avec ha-card-border-width: 0.
Ça évite sur surcharger avec card_mod, qui peut être lourd à charger.

Pour faire un thème:

1 « J'aime »
4

Les deux solutions fonctionnent bien. Seulement comme j’avais déjà créé un thème, j’ai tout simplement incorporé ha-card-border-width: 0. Dedans et ça fonctionne super bien :slight_smile:

2 « J'aime »
5

Salut
Tant mieux si tu as une solution mais par contre j’ai beaucoup de mal à comprendre la construction de ta carte.
Je pense qu’il y’a des horizontal-stack en trop et qu’il y’a moyen de faire plus simple.

1 « J'aime »
6

Sûrement pour l’instant je suis en face test car je n’ai pas les Sensor du capteur que je vais recevoir donc je ne sais pas vraiment ce que je vais avoir comme donnée