Apply card mod color attributes to template-entity-row in dashboard

Configuration Frontend
1

Hello, I use the following card_mod sequence in common entities cards to colorize icon, text and state separately:

card_mod:
  style:
    hui-generic-entity-row $: |
      {% if states(config.entity) == 'ok' %}
        state-badge {
          color: blue;
        }
        .info {
          color: green;
        }
        .state {
          color: red;
        }
      {% endif %

IMG_0292

However if I change entity type to template-entity-row it doesn’t colorize anymore:

type: custom:template-entity-row
card_mod:
  style:
    hui-generic-entity-row $: |
      {% if states(config.entity) == 'ok' %}
        state-badge {
          color: blue;
        }
        .info {
          color: green;
        }
        .state {
          color: red;
        }
      {% endif %}

IMG_0293

I tried a lot of options and searched the internet for a solution but couldn’t find one.

At the end I analyzed dashboard with browser developer tools and tried to address #wrapper DOM object:

IMG_0296
IMG_0296861×1537 198 KB

type: custom:template-entity-row
card_mod:
  style:
    '#wrapper':
      $: |
        {% if states(config.entity) == 'ok' %}
          state-badge {
            color: blue;
          }
          .info {
            color: green;
          }
          .state {
            color: red;
          }
        {% endif %}

Unfortunately this doesn’t work neither.

Any ideas how to get colorization work in template-entity-row?

2

This way is one method

type: entities
entities:
  - type: custom:template-entity-row
    entity: fan.bedroom_fan
    name: 
    state: state
    icon: mdi:fan
    card_mod:
     style: 
      div#wrapper: |
          state-badge {
            color: blue;
            }
          .state {
            color: red;
           }

image
image1522×508 32 KB

3

Thank you so much.