Farbanpassungen von State-Badges scheitern, ein Dummi braucht Hilfe

Zeigt mal her eure gelungenen Dasboards.
Welche Sind eure Lieblings Karten.
Und natürlich Rat und Tat zum Thema Dashboard.


Antworten
waschbär81
Beiträge: 4
Registriert: Mo 15. Apr 2024, 17:31
Has thanked: 2 times

Farbanpassungen von State-Badges scheitern, ein Dummi braucht Hilfe

Beitrag von waschbär81 »

Hallo zusammen,

ich habe eine picture elements card (kombi aus vertikalen und horizontalen stapeln), in der ich auf ein Foto als Hintergrund diverse State-Icons und State-Badges gebastelt habe. Die Badges zeigen verschiedene Temperaturen und Feuchtigkeistwerte an.
Funktion/Bedienung ist soweit alles vorhanden, jedoch würde ich es gerne optisch ein wenig verbessern.

Farblich würde ich gerne von den Sensoren die roten Kreise und den schwarzen Hintergrund verändern, so das sie je nachdem welcher Wert gemessen wird sie eine andere Farbe haben (grün wenn es im gewünschten bereich ist, gelb wenn es leicht daneben ist und rot wenn es kritisch wird. zudem sollten es tags und nachts andere bereiche sein, dies wollte ich über entsprechende Helfer verwirklichen).

dafür habe ich mir Mushroom und Card-Mod 3 über HACS installiert, aber irgendwie egal was ich eingebe, ich kann nur die Farbe der Titel ändern, sonst ändert sich farblich garnichts oder es regnet Fehlermeldungen.

YAml-code der Stapelkarte ohne farbcodes:

style:
border-radius: 20px
box-shadow: 3px 3px rgba(0,0,0,0.4)
border: solid 1px rgba(100,100,100,0.3)
overflow: hidden
image: /local/zelt3.png
elements:

  • style:
    label-badge-blue: green
    top: 62%
    left: 40%
    type: state-badge
    entity: sensor.sensor_pflanze_temperatur
  • style:
    color: green
    top: 71%
    left: 40%
    type: state-badge
    title: test
    entity: sensor.sensor_pflanze_luftfeuchtigkeit
  • style:
    color: white
    top: 31%
    left: 15%
    type: state-badge
    entity: sensor.sensor_zelt_temperatur
  • style:
    color: black
    top: 11%
    left: 80%
    type: state-badge
    entity: sensor.abluft_leistung
  • style:
    color: white
    top: 40%
    left: 15%
    type: state-badge
    entity: sensor.sensor_zelt_luftfeuchtigkeit
  • style:
    color: black
    top: 83%
    left: 81%
    type: state-badge
    entity: sensor.heizstab_leistung
  • style:
    color: black
    top: 99%
    left: 68%
    type: state-badge
    entity: sensor.sensor_keller_temperatur
  • style:
    color: black
    top: 99%
    left: 81%
    type: state-badge
    entity: sensor.sensor_keller_luftfeuchtigkeit
  • style:
    color: white
    top: 15%
    left: 76%
    type: state-icon
    entity: switch.abluft_schalter
  • style:
    color: white
    top: 15%
    left: 83%
    type: state-icon
    entity: switch.turbo_schalter
  • style:
    color: white
    top: 34%
    left: 81%
    type: state-icon
    entity: switch.licht_schalter
  • style:
    color: white
    top: 54%
    left: 81%
    type: state-icon
    entity: switch.ventilator_schalter
  • style:
    color: white
    top: 73%
    left: 81%
    type: state-icon
    entity: switch.heizstab_schalter
  • style:
    color: white
    top: 31%
    left: 22%
    type: state-icon
    entity: sensor.sensor_zelt_batterie
  • style:
    color: white
    top: 62%
    left: 48%
    type: state-icon
    entity: sensor.sensor_pflanze_batterie
  • style:
    color: white
    top: 98%
    left: 59%
    type: state-icon
    entity: sensor.sensor_keller_batterie
    type: picture-elements

was ich zB bisher probiert habe (das habe ich aus einer anderen programmierung kopiert, namen hatte ich natürlich entsprechend angepasst):

type: entities
entities:

  • entity: input_number.number1
    card_mod:
    style: |
    :host { {% if states('input_number.number1') | int <=50 %}
    background: green;
    --card-mod-icon: mdi:light-switch;
    --card-mod-icon-color: orange
    {% elif states('input_number.number1') | int >50 and states('input_number.number1') | int < 80 %}
    background: yellow;
    --card-mod-icon: mdi:garage-open;
    {% elif states('input_number.number1') | int >= 80 %}
    background: red;
    {% endif %}
    }

das hat nur bei entitäten-karten funktioniert :cry:
geht das was ich gerne hätte überhaupt? hat jmd von euch schon sowas gebastelt?

ich hab mir bisher beholfen das ich daneben seperate karten erstellt habe die reine Entitäten-Karten sind, die dann die farben ändern, jedoch habe ich noch nichts gefunden um für nachts und tags andere bereiche zu definieren.
Hat dafür jmd eine idee? bzw mir einen code für yaml? ich kenne mich leider nicht aus mit yaml.

gruß andre

Dateianhänge
Screenshot 2024-04-17 134257.png
Screenshot 2024-04-17 134257.png (52.82 KiB) 170 mal betrachtet
Benutzeravatar
Friedi
Beiträge: 446
Registriert: Do 22. Jul 2021, 16:57
2
Has thanked: 36 times
Been thanked: 21 times

Re: Farbanpassungen von State-Badges scheitern, ein Dummi braucht Hilfe

Beitrag von Friedi »

Also ich weiß jetzt nicht, wie es den anderen hier geht, aber ich verstehe hier leider nur Bahnhof und kann auch mit dem "Screenshot" nichts anfangen :?
Was soll denn dieses Bildchen darstellen?

Dein Code ist schwer zu lesen, da du ihn leider einfach ohne Formatierung eingefügt hast. Füge das nächste mal bitte den YAML-Code mit der entsprechenden Funktion ein:

  • code und /code (jeweils in eckigen Klammern)

Mein persönliches Hauptproblem ist aber, dass ich keine Ahnung habe, was das für Erweiterungen sind. Da wäre ein Link auf die entsprechenden Git-Seiten hilfreich. Ich helfe gerne, habe aber keine Lust ewig nach der Doku zu den Erweiterungen zu suchen.

Also bitte Links auf die Doku, dann versuche ich mal, was da geht bzw. ob das geht, was du willst.

Antworten