Couleurs d'icones dans templates?

Entraide Home Assistant
1

Bonsoir,
Malgré la lecture de nombreuses discussions sur ce forum, je n’arrive pas à faire changer la couleur de l’icone d’une entité.
J’arrive très bien à modifier l’icone de l’entité dans son template, mais je n’arrive pas à en faire changer la couleur.
Ci-dessous le code du template:

    - name: "Etat lave linge"
      unique_id: etat_lave_linge
      state: >-
        {% if is_state('input_boolean.lave_linge_cycle', 'off') %}
          Arrêté
        {% else %}
          En cours
        {% endif %}
      icon: >-
        {% if is_state('sensor.etat_lave_linge', 'Arrêté') %}
          mdi:washing-machine-off        
        {% else %}
          mdi:washing-machine-alert
        {% endif %}
      icon_color: >-
        {% if is_state('sensor.etat_lave_linge', 'Arrêté') %}
          rgb(251, 210, 41)        
        {% else %}
          rgb(54, 95, 140)
        {% endif %}

J’affiche ensuite l’état des différents electroménagers dans une carte « Glance »
image

Si dans mon template je ne mets pas la partie icon_color, tout va bien, et les icones changent bien en fonction de l’état. Si je rajoute la partie icon_color, les templates ne fonctionnent plus du tout.

Une idée?
Merci d’avance

2

Salut @Gilles2

Même si j’ai une idée, il manque une info importante : le type de carte.

Toutes les cartes ne sont pas « sensibles » aux templates, et quand elles le sont la syntaxe peut changer en fonction du type de carte justement :wink:

3

@Herbs , merci de vouloir m’aider. Le type de carte est bien indiqué dans mon message : Glance

4

Ouais désolé je me suis focus sur le code, et pas sur la suite :wink:

Donc là ça ne fonctionnera pas tel que, va falloir jouer du card-mod je pense.

Ou changer pour un autre type de carte comme du custom-button-card ou du mushroom-template.

1 « J'aime »
5

J’ai essayé de jouer du card_mod aussi, mais sans trop de succès.
Ci-dessous le code de la carte elle-même:

  - show_name: true
    show_icon: true
    show_state: false
    type: glance
    entities:
      - entity: sensor.etat_lave_linge
        name: Lave linge
      - entity: sensor.etat_seche_linge
        name: Sèche linge
      - entity: sensor.etat_lave_vaisselle
        name: Lave vaisselle
      - entity: sensor.etat_charge_voiture
        name: Charge voiture
    state_color: true
    card_mod:
      style: |
        ha-card {
          padding: -20px !important;
          border: none;
          top: 0px;
          height: 90px !important;
        }
6

Tu peux aller jeter un oeil ici :

Tu vas trouver plein d’exemple pour des cartes « Glance » :wink:

7

J’avais lu un autre sujet avant de poster mon message. Il parlait surtout des cartes « entity », très peu de « glance » (ou alors j’ai lu trop vite).
Merci pour ce lien. Je vais reprendre le sujet à tête reposée plus tard je pense…

8

Je réponds à ce sujet avec la solution pour servir à d’autres.
Merci @Herbs pour avoir pointé sur le bon post sur le long sujet sur CSS et Card_mod :slight_smile:
Alors en résumé:
Le résultat de la carte Glance:
image
Et le code associé:

  - show_name: true
    show_icon: true
    show_state: false
    type: glance
    entities:
      - entity: sensor.etat_lave_linge
        name: Lave linge
        card_mod:
          style: |
            state-badge {
              {% if is_state(config.entity, 'En cours') %}
                color: red !important;
              {% else %}
                color: grey !important;
              {% endif %}
            }
      - entity: sensor.etat_seche_linge
        name: Sèche linge
        card_mod:
          style: |
            state-badge {
              {% if is_state(config.entity, 'En cours') %}
                color: red !important;
              {% else %}
                color: grey !important;
              {% endif %}
            }
      - entity: sensor.etat_lave_vaisselle
        name: Lave vaisselle
        card_mod:
          style: |
            state-badge {
              {% if is_state(config.entity, 'En cours') %}
                color: red !important;
              {% else %}
                color: grey !important;
              {% endif %}
            }
      - entity: sensor.etat_charge_voiture
        name: Charge voiture
        card_mod:
          style: |
            state-badge {
              {% if is_state(config.entity, 'En cours') %}
                color: red !important;
              {% else %}
                color: grey !important;
              {% endif %}
            }
    state_color: true
    card_mod:
      style: |
        ha-card {
          padding: -20px !important;
          border: none;
          top: 0px;
          height: 90px !important;
        }
1 « J'aime »