config.entity not working in card_mod for setting styles

[royf007]

I'm trying to set the ha-icon styles within card_mod, based on the entity state. Is this possible? It works if I hard-code an entity name, but not when using config.entity .

My YAML is below.

square: false
type: grid
columns: 1
cards:
  - type: vertical-stack
    cards:
      - type: custom:auto-entities
        card:
          type: custom:bar-card
          card_mod:
            style: |
              ha-icon {
                {% if states (config.entity) | float > 100  %}
                  color: orange;
                {% else %}
                  color: red;
                {% endif %}
              }
         entities:
          - entity: sensor.main_ac_compressor_usage
            name: AC Main Compressor
            animation: true
            icon: mdi:flash
            positions:
              indicator: outside
            max: 3800
            severity:
              - color: Red
                from: 700
                to: 3800
              - color: Orange
                from: 400
                to: 699
              - color: Green
                from: 0
                to: 399
        filter:
          include: []
          exclude: []
        sort:
          method: state
          numeric: true
          reverse: true
        show_empty: false

[ildar170975]

Not supposed to work here. Suggest to use Community for asking questions, this is not a bug. Besides, this is not related to auto-entities. Check only bar-card with same card-mod code and a FEW entities w/o auto-entities - you will see same “bug” (which is not a bug). FEW - means “several”, because this is what you do by using “entities” option, although bard-card support a single “entity” option - try it and probably your config will work.

[royf007]

Thank you for the quick response! It makes sense now. The limitation is with the custom:bar-card. I was able to modify the bar card to accept icon related configuration. I'm using auto-entities like so:

  - type: vertical-stack
    cards:
      - type: custom:mod-card
        card:
          type: custom:auto-entities
          card:
            type: custom:bar-card-rf
            icon_color_by_severity: true
            animation: true
            icon: mdi:flash
            height: 20px
            positions:
              indicator: outside
            columns: 1
            card_mod:
              style: |
                ha-icon {
                  animation: pulse 1.5s infinite alternate;
                  color: #FFB343;
                  margin-top: 6px;
                }
                @keyframes pulse {
                  0% {
                    transform: scale(1);
                    opacity: .5;
                  }
                  50% {
                    transform: scale(1);
                    opacity: .75;
                  }
                  100% {
                    transform: scale(1);
                    opacity: 1;
                  }
                }
                bar-card-card {
                  height: 14px;
                }
                bar-card-currentbar {
                  border-radius: 1px;
                }
                bar-card-backgroundbar {
                  opacity: 0.75;
                }
                bar-card-iconbar {
                  width: 26px;
                }
                .card-content {
                  background-color: #000000;
                  border: 1px solid #000000;
                  border-radius: 12px;
                  animation: pulse-shadow-energy 5s infinite alternate;
                  margin-right: 2px;
                  padding-right: 8px;
                  padding-left: 2px;
                  padding-top: 8px;
                  padding-bottom: 12px;
                }        
                @keyframes pulse-shadow-energy {
                  0% {
                    box-shadow: 0 0 0.0625rem 0.0625rem #FF00E0; /* Bright Magenta */
                  }
                  50% {
                    box-shadow: 0 0 0.0625rem 0.09375rem #0055FF; /* Blue and Green */
                  }
                  100% {
                    box-shadow: 0 0 0.0625rem 0.125rem #FF8C00; /* Dark Orange */
                  }
                }
          entities:
            - entity: sensor.main_ac_compressor_usage
              name: AC Main Compressor
              max: 3800
              severity:
                - color: Red
                  from: 700
                  to: 3800
                - color: Orange
                  from: 400
                  to: 699
                - color: Green
                  from: 0
                  to: 399
            - entity: sensor.emporia_vue3_pool_panel_sprinkler_power
              decimal: 0
              name: Sprinkler
              max: 1600
              severity:
                - color: Red
                  from: 100
                  to: 1600
                - color: Green
                  from: 0
                  to: 99