thomasloven / lovelace-fold-entity-row

🔹 A foldable row for entities card, containing other rows
MIT License
561 stars 37 forks source link

Card-mod style is not modified on load with fold-entity-row #221

Open jjprz opened 2 years ago

jjprz commented 2 years ago

My Home Assistant version: 2021.3.3

Fold-entity-row version (FROM BROWSER CONSOLE): 2.2.0

What I am doing: Styling Secondary Information with Card-mod

What I expected to happen: change the style

What happened instead: The style of the secondary information is not modified. When I display the arrow the style is applied but on load it is not.

Animation

        - type: custom:fold-entity-row
          head: 
            type: custom:multiple-entity-row
            secondary_info:
              entity: sensor.humedad_dormitorio
              name: "💧"
              unit: '%'
            entity: light.bano_dormitorio
            icon: fas:bath
            toggle: true
          card_mod:
            style:
              multiple-entity-row $:
                hui-generic-entity-row $: |
                  .info .secondary { font-size: 11px !important; color: white !important; opacity: 0.5; }

Error messages from the browser console: No error messages With other older versions of fold-entity-row it works.

jjprz commented 2 years ago

The problem only occurs when multiple-entity-row is in head

ildar170975 commented 2 years ago

Probably same: https://github.com/thomasloven/lovelace-fold-entity-row/issues/215

ildar170975 commented 2 years ago

@jjprz Try this code:

  - type: custom:fold-entity-row
    head:
      type: custom:multiple-entity-row
      secondary_info:
        entity: sensor.weather_home_met_temperature
        name: ❄️
      entity: sun.sun
      entities:
        - sun.sun
        - sun.sun
      card_mod:
        style:
          hui-generic-entity-row $: |
            .info .secondary { color: red !important; }
    entities:
      - sun.sun
      - sun.sun

image

Here card_mod is moved to the head level and the style is applied successfully. If card_mod is located on the fold-entity-row level it works only in some conditions (check https://github.com/thomasloven/lovelace-fold-entity-row/issues/215). So, you issue seems to be a duplicate of https://github.com/thomasloven/lovelace-fold-entity-row/issues/215 but has a good workaround.

ildar170975 commented 1 year ago

Both variants work stable now:

type: entities
entities:
  - type: custom:fold-entity-row
    head:
      type: custom:multiple-entity-row
      secondary_info:
        entity: sun.sun
        name: ❄️
      entity: sun.sun
      entities:
        - sun.sun
        - sun.sun
    entities:
      - sun.sun
      - sun.sun
    card_mod:
      style:
        div#head multiple-entity-row $:
          hui-generic-entity-row $: |
            .info .secondary { color: red !important; }
  - type: custom:fold-entity-row
    head:
      type: custom:multiple-entity-row
      secondary_info:
        entity: sun.sun
        name: ❄️
      entity: sun.sun
      entities:
        - sun.sun
        - sun.sun
      card_mod:
        style:
          hui-generic-entity-row $: |
            .info .secondary { color: red !important; }
    entities:
      - sun.sun
      - sun.sun

image

I think the issue may be CLOSED.