Styles not applied under Conditional card

[paqpaqpaq]

As previous issues have been closed, it seems for some it hasn't really been resolved.

On MacOS Chrome and Safari, as well as Android Fully Kiosk, the style is not applied when under a conditional card. In the browser's development tools the card-mod remains empty and seems to be wrongly mapped too.

  - type: conditional
    conditions:
      - entity: humidifier.zhimi_cb1_438c_humidifier
        state: 'on'
    elements:
      - type: icon
        show_icon: true
        icon: mdi:waves
        style:
          top: 19.5%
          left: 73%
          color: gainsboro
          transform: scale(0.7,0.7)
          '--divider-color': none
      - type: state-label
        entity: sensor.tankinhoud_humidifier_kantoor
        style:
          top: 21.5%
          left: 76%
          font-weight: bold
          font-size: 90%
        card_mod:
          style: |
            :host {
              color:
                  {% set inhoud = states('sensor.tankinhoud_humidifier_kantoor')|float %}
                  {% if inhoud <= 1 %}
                    #FFD700
                  {% elif inhoud > 1 %}
                    #DCDCDC
                  {% endif %}
                  }

This works only when the conditional card is removed. The above code outputs this in the browser:

The card-mod tag doesn't end up under the div that it's regarding to.

Home Assistant 2023.10.2 Supervisor 2023.10.1 Frontend-versie: 20231005.0 - latest Latest card-mod version

[ildar170975]

This is not a conditional card. This is a conditional element inside a picture-elements card. Sub-elements cannot he styled like you tried, you need to move styles on a parent element level.

[ildar170975]

Not to mention a fact that this may be implemented by using a user-defined variable set by card-mod. Suggest to discuss things with Community before posting issues.

[paqpaqpaq]

This is not a conditional card. This is a conditional element inside a picture-elements card. Sub-elements cannot he styled like you tried, you need to move styles on a parent element level.

I did not know that it was 'meant' not to work. If I move this element to a parent level, there is no condition to be linked to it.

[EvertJob]

Not to mention a fact that this may be implemented by using a user-defined variable set by card-mod. Suggest to discuss things with Community before posting issues.

Relaxt man. Think about your blood pressure.

[ildar170975]

Relaxt man. Think about your blood pressure.

Save your breath, do not speak useless gibberish.

[ildar170975]

If I move this element to a parent level, there is no condition to be linked to it.

As I said - "Suggest to discuss things with Community before posting issues." Come to the huge card-mod Community thread for help.

[paqpaqpaq]

@ildar170975 If I use a card instead of another element, it does work underneath the conditional element. It is still a little hard to wrap my head around...

[EvertJob]

Relaxt man. Think about your blood pressure.

Save your breath, do not speak useless gibberish.

You’re such a big baby with a reaction of that kind. You can chill and make you’re point on a much nicer and friendlier way.

[ildar170975]

@EvertJob just do not to waste time for useless talks with people like you who are trying to get someone's attention.

@paqpaqpaq As I said - 2 ways: either define your style on a conditional element level OR define a variable on the same level. Details in Community thread.

[EvertJob]

@EvertJob just do not to waste time for useless talks with people like you who are trying to get someone's attention.

and still replying, so you’re on the same level as I am.

[ildar170975]

Answers were provided. Not a bug / FR. Wrong use by a user.