HACS stack-in-card für Raum-Card

[scw2wi]

Das zwar nicht,
--chip-border-width: 0; blendet den Kreis um das linke Symbol aus
order: none; blendet die Kreise um die rechten Symbole aus

die Hintergrundfarbe ist aber trotzdem nicht ganz unwichtig, da ich all jene Symbole die ich nicht zeigen will derzeit noch mit
icon_color: "#1c1c1c"
ausblende. Das muss ich noch auf meine ToDo Liste schreiben, dass ich da eine bessere Lösung benötige.

[starwarsfan]

Hallo miteinander

Wenn dir eine dieser Cards in deiner HACS Liste fehlt bzw. nicht heruntergeladen ist, dann kann es nicht funktionieren. Du solltest in diesem Fall aber eigentlich eine Fehlermeldung erhalten, dass diese Karte nicht gefunden wird.

Ja und nein. Ich hatte Fehlermeldungen für die fehlenden Karten bekommen und diese dann natürlich installiert. Wofür es aber keine Fehlermeldung gab und was schlussendlich noch gefehlt hat, war card-mod. Nachdem ich das gerade eben nachinstalliert habe, sieht es nun so aus:

2025-01-04_stack-in-card.png

Wenn es dann bei dir funktioniert, noch ein kleines Update

Das muss ich noch testen...

Sieht man die Kreise bei scw2wi wegen der Hintergrundfarbe eventuell nicht?

Siehe oben, das ist durchaus möglich. Insbesondere weil sie dort auch noch dunkler sind, wo sie sich überlagern!?

[scw2wi]

Du hast wohl einen anderen Dashboard Style als ich.

Möglicherweise hilft dir dieser Beitrag weiter. Es geht dort darum, die Mushroom state-icon und shape-icon Farbe anzupassen, also z.B. so:

card_mod:
  style:
    mushroom-shape-icon$: |
      .shape {
          background: rgba(var(--card-background-color),0) !important;
        {% endif %}
      }
​

card-background-color muss ev. noch durch den Namen deiner Hintergrundfarbe ersetzt werden, falls er anders ist.

Ich bin ja leider noch nicht wirklich ein card_mod Kenner und kann derzeit auch nur Ideen von anderen per copy/paste übernehmen und geringfügig anpassen.

[starwarsfan]

Hallo miteinander,

nach ein wenig einlesen in card_mod war die Lösung,

border: none;

mit

--chip-background: var(--supplies-button-color-off);

zu ergänzen. Damit sieht's nun so aus:

2025-01-04_stack-in-card_fixed.png

[scw2wi]

Die ausgeblendeten Icons haben aber noch #1C1C1C und sind daher schwarz und bei dir damit sichtbar, das gehört eigentlich auch noch verbessert.

Update:
Ich hab die Lösung gefunden, bin halt auch schon etwas schlauer als noch vor ein paar Wochen.

alte Lösung für unsichtbare Icons: icon_color: "#1c1c1c"
ersetzen durch neue Lösung:

              border: none;
              --icon-primary-color: none; # damit werden sie wirklich ausgeblendet
​

Update2:
Diese Lösung funktioniert leider nur dann, wenn alle chip-icons die gleiche Größe haben, was bei mir aktuell nicht der Fall ist.
neue Lösung für auszublendende Icons bei unterschiedlicher Icon-Größe:

              border: none;
              --chip-background: var(--supplies-button-color-off);
              --icon-primary-color: var(--card-background-color);
​

Card_Mod kann zwar wahnsinnig viel, aber es gibt scheinbar keine vollständige Doku sondern nur unzählige Einzellösungen, die mehr oder weniger passend übernommen werden können. Das ist vermutlich auch der Grund, warum sich ChatGPT nicht darauf trainieren lässt. Die aktuelle HA Version 2025.01 soll sogar viele bereits bestehende card_mod Lösungen ruinieren.

[scw2wi]

Nach der Raum-Übersichtskarte über ein ganzes Geschoß hier nun der erste Entwurf für eine Raum-Detail-Card, wo nur ein Raum (dafür aber detaillierter) dargestellt wird. Die Volums-Anzeige habe ich natürlich nicht selbst erfunden, die ist von hier übernommen. Ich musste sie jedoch von der entities card auf die mushroom-template-card übertragen, was auch ganz schön lehrreich für mich war.

HACS-Raumcard-Detail.png

Diesmal hab ich alle Teile mit der custom button-card gestackt, dann aber noch etwas zurecht geschoben, damit es optisch besser passt. Bei Bewegung und Fenster ist keine Volumsanzeige geplant, bei den anderen ist es bisher zumeist nur hardcoded.

Im HA-Dashboard passt diese Card 8x nebeneinander, also gehen sich in 3 bis 4 Reihen locker alle Räume aus. Die Idee ist, dass ich als Basisbild den Grundriss hernehme, und diese Card dann in jedem Raum platziere, das ist aber ein Job für später.

Ich möchte beide Raum-Karten noch auf die decluttering-card umstellen, da man da sehr viele Code-Dubletten einsparen könnte, aber mit card_mod ist das gar nicht so einfach, da sich die CSS Bereiche verschieben, und ich noch kein System kenne, um das anzupassen. Wer sich damit gut auskennt, ich nehme jede Hilfe gerne an.

[scw2wi]

Nachdem mich die Raum-Card-Detail noch nicht überzeugt hat, gibt es hier ein Update auf die V2.

HACS-Raumcard-Detail-V2.png

Das Raum-Icon ist jetzt in die Mitte gewandert und die 6 Symbole sind symmetrisch gruppiert,
so dass auch in Räumen ohne AC & Musik die Symmetrie erhalten bleibt.

Links sind die passiven Icons, die nicht von der Anwesenheit einer Person im Raum abhängen müssen,
rechts sind die aktiven Icons, da Licht und Musik meist durch Anwesenheit gesteuert wird.

Für den Szene-Namen ist mehr Platz, die Farbe könnte z.B. eine aktive Sperre (manuelles Overrulen) kennzeichnen,
und der VOC-Wert geht sich jetzt auch noch aus, dafür hab ich aber leider kein mdi-Symbol gefunden.

Die graue conic-Background Color hab ich jetzt transparent gemacht, sieht so viel besser aus.
Bei der Ring-Stärke hab ich noch verschiedene Werte, das muss sich noch einpendeln, ist ja alles noch Work-in-Progress.

[Punker Deluxe]

Die graue conic-Background Color hab ich jetzt transparent gemacht, sieht so viel besser aus.

Wo genau in der yaml?

[schrotti93]

{% set BACK_COLOR = "rgba(127,127,127,0.1)" %}

Der A-Wert (0.1) ist die Transparenz.

BACK_COLOR wird dann hier verwendet:
conic-gradient(
{{RING_COLOR}} {{VALUE}}% 0%,
{{BACK_COLOR}} 0% 100%
);

[Punker Deluxe]

Danke, und schon stehe ich wieder auf dem Schlauch... hier meine yaml, siehe auch Post in https://knx-user-forum.de/forum/proj...-tachoanzeigen

[scw2wi]

Die Raumcard V1 ist nicht tot, im Gegenteil, es gibt ein Update und eine neue V3, die sogar noch kompakter ist als die V1.

HACS-Raumcards.png

Hier die wesentlichen Änderungen.

Der Parameter aspect_ratio hat bei der button-card so viele Nachteile, dass ich ihn komplett entfernt habe. Wesentlich besser ist es, bei styles card die height und width direkt anzugeben. Damit ist das Höhenverhältnis genauso gut definiert, und die Card sieht auf jedem Screen gleich gut aus.

Bei der mushroom-template-card hab ich noch layout: vertical definiert, damit sind die Werte gleich unterhalb des Icons und müssen nicht erst dorthin verschoben werden. Den großen Vorteil sieht man beim Laden des Dashboards, da alle Verschiebungen erst im zweiten Schritt erfolgen und damit sichtbar sind.

Ich werde für große Räume die V2 verwenden und für kleine die V3, oder eine noch kleinere bauen. Jetzt muss ich nur noch lernen, wie man mehrere dieser Karten frei über dem Hintergrundbild des Grundrisses anordnen kann, aber vorher hab ich noch andere Themen in der Queue.

[Tom Bombadil]

Die aktuelle HA Version 2025.01 soll sogar viele bereits bestehende card_mod Lösungen ruinieren.

Das stimmt tatsächlich.

Mittlerweile scheint da aber etwas Ruhe reinzukommen. Ich empfehle, die card-mod Version zu prüfen: Wer das vorschnell freigebene 3.5.0 Update gleich bei Erscheinen über HACS Update installiert hat, sollte wie folgt vorgehen (hat mir bei allen zerlegten Karten geholfen, und auch bei den meisten anderen Usern, von denen ich so gelesen habe):

- HACS aufrufen
- card-mod filtern, anklicken
- Version prüfen

bei Version 3.5:
- deinstallieren
- HA neu starten, HACS aufrufen
- card-mod installieren, Version 3.4.4 auswählen (3.5 erscheint auch nicht mehr in der Liste)

Hintergrund: Die 3.5.0 wurde komplett zurückgerufen, da sie haufenweise Fehler mitbringt, aber kaum Probleme mit der 2025.01 löst; ein Downgrade ist aber über HACS nicht möglich. Daher manuelle (de-)Installation. Kaputt geht dabei nix.

/tom

[scw2wi]

Ich werde die 2025.01 komplett überspringen und frühestens bei 2025.02.03 wieder an ein Update denken, und durchführen auch nur dann, wenn card_mod wieder angepasst ist.

Es entstehen im github issue gerade viele Anleitungen dazu, und angeblich bietet die Änderung auch deutliche Verbesserung, aber trotzdem möchte ich warten, bis das etwas stabiler läuft.

[Tom Bombadil]

Ja, den issue hab ich hier auch auf Sicht. Ich hatte mich Ende letzten Jahrens schon gewundert, warum es um Thomas (den Autor von card-mod, der button-card und vielen, vielen anderen schönen Sachen) so ruhig geworden ist - so war er zB regelmäßig auf dem Discord zu sehen, aber hat sich an Diskussionen fast gar nicht mehr beteiligt.

Im genannten issue hat er nun öffentlich gemacht, dass er aus gesundheitlichen Gründen deutlich kürzer treten muss. Daher war das Downgrade für mich (ganz nüchtern betrachtet) die einzig sachlich richtige Entscheidung; dadurch konnten zumindest alle Probleme auf meinen beiden Systemen (produktiv, Entwicklung) gefixed werden.

/tom

[Sven1973]

Ich hab jetzt mal eine Raumkarte von Dir versucht abzuändern, so dass ich einen Überblick über alle Räume auf den Etagen habe. nun wollte ich ich das "window-icon" in Abhängigkeit zum Status der Readkontakte bringen

- type: entity
        entity: sun.sun
        icon: >
          {% if is_state('binary_sensor.wohnzimmer_terrasse_sud_offen', 'on') or
          is_state('binary_sensor.wohnzimmer_terrasse_sud_kippd_kipp', 'on') %}
            mdi:window-open-variant
          {% else %}
            mdi:window-closed-variant
          {% endif %}              
        icon_color: orange
        content_info: none
        card_mod:
          style: |
            ha-card {
              border: none;
              background: rgba(0,0,0,0) !important;
            }​

Leider bringt das nicht den gewünschten Erfolg.

grafik.png


EDIT:
eventuell hilft es ja dem Ein oder Anderen. So klappt es:

      - type: entity
        entity: sun.sun
        icon: null
        icon_color: orange
        content_info: none
        card_mod:
          style: |
            ha-card {
              border: none;
              background: rgba(0,0,0,0) !important;
              --card-mod-icon:
                {% if is_state('binary_sensor.wohnzimmer_terrasse_sud_offen', 'on') or is_state('binary_sensor.wohnzimmer_terrasse_sud_kipp', 'on') %}
                  mdi:window-open-variant
                {% else %}
                  mdi:window-closed-variant
                {% endif %}
            }​