Hintergrund-Farbe ändern in Abhängigkeit einer Variable

[loewes]

Hallo zusammen,

ich habe wahrscheinlich eine einfache Frage, aber ich habe viele verschiedene Lösungen dafür in Foren gefunden, aber bei mir geht nichts davon. Vielleicht kann mir jemand erklären, was ich falsch mache und wie ich mein Problem lösen kann:
Ich möchte eine entity-card verwenden, um einen Messwert anzuzeigen und der Hintergrund der Karte soll je nach Zustand eines Schalters eine andere Farbe haben. Mein Versuch ist der hier:

type: entities
entities:
  - entity: sensor.taupunkt
    secondary_info: last-updated
state_color: true
card_mod:
    style: >-
      ${ if (input_boolean.abc === 'on') {
        'ha-card {background-color: #AAFFAA;}'
      }
      else {
        'ha-card {background-color: #FFAAAA;}'
      }}

Ich bekomme allerdings gar keine Hintergrundfarbe...
Kann mir da jemand weiterhelfen?
Danke schon mal!

 

[Nival]

Versuchs mal so:

card_mod:
  style: |
    ha-card {
      background-color:
        {% if states('input_boolean.abc') == 'on' %} #AAFFAA
        {% else %} #FFAAAA
        {% endif %}
      }

 

[loewes]

Danke, aber das geht leider auch nicht, mein Problem ist, dass es auch so nicht geht:

card_mod:
  style: |
    ha-card {
      background-color: #FFAAAA
      }

So müsste ich doch einfach nur eine Farbe festlegen können? Da geht auch nix...

 

[u5zzug]

hast du card_mod installiert?

 

[loewes]

Oh Mist, ist das peinlich, das war deaktiviert
Danke für die Hilfe, es funktioniert jetzt, sorry...

 

[loewes]

Aber jetzt vielleicht doch noch eine Frage: die Hintergrund-Farbe funktioniert jetzt gut, aber wenn ich die Seite mit einem alten Windows Phone öffne (das ich als Anzeige benutze), dann ist Standard-Hintergrund und keine Einfärbung. Hat jemand eine Idee, woran das liegen könnte?

 

[Nival]

Hat jemand eine Idee, woran das liegen könnte?

Versuch mal, hinter beide Farbwerte noch nen Semikolon zu setzen, ältere Browser sind da manchmal etwas sensibel.

 

[loewes]

Hat leider auch nicht funktioniert, aber ich denke auch, dass es irgendwie an dem alten Browser liegt. Vielleicht kann ich auch in Abhängigkeit der Variablen die angezeigte Temperatur größer und in anderer Farbe darstellen? Oder schätzt Ihr, dass das genauso wenig funktioniert?

 

[u5zzug]

mal eine mushroom template karte probieren?

 

[Nival]

Wenn etwas so simples wie background-color nicht funktioniert nehme ich an, dass es eher an dem (dort nicht) ausgeführten / funktionierenden Javascript liegt und andere CSS-Angaben über card_mod ebenfalls nicht funktionieren. Mushroom könnte noch einen Versuch wert sein.

 

[loewes]

Vielen Dank für die Hinweise, ich hab jetzt eine nette Mushroom Karte gebastelt und es funktioniert auch alles, nur wieder auf dem Windows Phone geht nix, jetzt aber mit Fehlermeldung:

Vielleicht hat jemand damit eine Idee? Sonst lass ich mir eine andere Lösung einfallen, nur mit den Standard-Karten, die scheinen ja zu funktionieren...

 

[Nival]

Sonst lass ich mir eine andere Lösung einfallen, nur mit den Standard-Karten, die scheinen ja zu funktionieren...

Ich fürchte, das wird der nötige Weg sein müssen - ggf. über nen spezifischen Template-Sensor der dann schon alles übergibt. Das sieht wirklich sehr nach "der Browser macht kein aktuelles Javascript und ggf. nichtmal sonstige aktuelle Techniken" aus.

Alternative wäre, Du suchst eine sehr, sehr, sehr alte Version dieser Dinge (falls es die gibt, das weiß ich nicht) die der Browser eventuell verstehen mag. Microsoft / Windows war da aber schon immer maximal weinerlich, der IE war nicht ohne Grund extrem verhasst bei Webentwicklern.

GANZ VIELLEICHT kann man den Text auch noch mit inline CSS versehen, aber das ist nur ne fixe Idee und ungetestet.

 

[loewes]

Vielen Dank für die Infos und die Unterstützung! Dann bastel ich was mit den Standard-Cards...

 

[u5zzug]

schon mal ohne cache die Seite neu geladen?