Mushroom Light Card Syntax-Probleme

Dashboard/Cards/Frontend
,
1

Hallöchen,

ich versuche gerade eine Mushroom Light Card farblich anzupassen, aber ich komme mit der Syntax scheinbar nicht klar.

So sieht die Karte aus
Inaktiv
grafik

Aktiv
grafik

Hier der aktuelle Code:

type: custom:mushroom-light-card
show_brightness_control: true
collapsible_controls: false
show_color_control: false
show_color_temp_control: false
use_light_color: false
layout: horizontal
icon: mdi:food-fork-drink
hold_action:
  action: more-info
fill_container: false
entity: light.lampe_esstisch
icon_color: blue
card_mod:
  style:
    mushroom-light-brightness-control$: |
      mushroom-slider {
        --main-color: teal !important;
        --bg-color: #d1eced !important;
      }

Ich möchte aber das sich die Farbe des Icons (nicht die des Sliders) je nach Zustand in Blue für Aus und Yellow für An ändert.

Ich habe das schon mal für eine Template-Card so realisiert.

icon_color: |-
         {% if is_state("light.lampe_esstisch", "on") %}
           yellow
         {% else %}
           blue
         {% endif %}

Allerdings bekomme ich das nicht in den obigen Code eingebaut.
Wenn ich icon_color durch diesen Code ersetze funzt das nicht.

Kann mir da jemand helfen?

Viele Grüße
Markus

2

Nur die mushroom-template-card unterstützt Templating.
In allen anderen Karten musst es über card_mod machen:

card_mod:
  style: |
    ha-state-icon {
      {% if is_state("light.lampe_esstisch", "on") %}
        color: yellow;
      {% else %}
        color: blue;
      {% endif %}
    }
3

Hi Alex,

danke Dir.
Aber wie bekomme ich den Slider konfiguriert?

Das funzt nicht. Die Slider-Farbe ändert sich nicht.

type: custom:mushroom-light-card
show_brightness_control: true
collapsible_controls: false
show_color_control: false
show_color_temp_control: false
use_light_color: false
layout: horizontal
icon: mdi:food-fork-drink
hold_action:
  action: more-info
fill_container: false
entity: light.lampe_esstisch
card_mod:
  style: |
    ha-state-icon {
      {% if is_state("light.lampe_esstisch", "on") %}
        color: yellow;
      {% else %}
        color: blue;
      {% endif %}
    }
    mushroom-light-brightness-control$: |
      mushroom-slider {
        --main-color: teal !important;
        --bg-color: #d1eced !important;
      }

Viele Grüße
Markus

4

Hi Markus,
hast du das gelöst bekommen? Ich habe gerade das gleiche Problem. Scheinbar kann man die beiden styles nicht hintereinander hängen, einzeln funktionieren sie aber. Vermutlich irgend ein Syntax-Problem, aber da steige ich mit meinem Wissen leider aus.

5

Hi,

nein, habe bisher keine Lösung gefunden.

Viele Grüße
Markus