Hallo zusammen. Ich benötige mal wieder eure Hilfe.
Ich habe bei Github die Banner Card gefunden. Wenn ich sie mir dort kopiere und bei mir einfüge ist die schlicht weg zu groß. Verkleiner ich die Karten dur eine Raster oder so bleibt der Inhalt der Banner Card trotzdem Groß. Kann ich die Größe anpassen? Es geht um diese Button Card von Github
Hast du es mal mit size: 100px oder size: 50% versucht?
Ansonsten versuch es mal mit
styles:
card:
- width: 100px
@sirector leider ändert sich da nichts dran.
So hab ich es stehen:
type: custom:banner-card
styles:
card:
- width: 40px
heading:
- mdi:shower
- Bathroom
background: '#B0C2ED'
link: /lovelace/bathroom
entities:
- entity: light.lichter_kaminzimmer
name: Licht
- entity: sensor.thermostat_wohnzimmer_temperature
name: Temperatur
- entity: sensor.thermostat_wohnzimmer_humidity
name: Luftfeuchtigkeit
Bin leider auch noch ziemlich neu bei der Sache
by HarryP: Codezeilen in Code-TAG’s eingebunden
Schau mal hier
Hier wird z. B.
--banner-card-button-size
angesprochen. Hast du das versucht?
1 „Gefällt mir“
Hallo,
ich kenne die Banner Card nicht und ich weiß auch nicht genau was du machen möchtest … ABER ich vielleicht kannst du es auch mit der Rooms Card machen … schau mal das Video hier Rooms Card
1 „Gefällt mir“
Guten Morgen zusammen,
ich hab mir heute mal die Room Card angesehen und bin ziemlich zufrieden. Sowas habe ich gesucht. Jetzt muss es mir nur noch gelingen, dass ich den Hintergrund farblich ändern kann. Muss der Befehl “Background:” an einer bestimmten stelle stehen? Ich habe jetzt 2 Stellen ausprobiert aber keine Reaktion-
du möchtest so etwas machen ?
hier die Antwort vom Entwickler:
schau vielleicht mal in den Thread nach:
Wenn es geklappt hat, vielleicht möchtest du dein Code hier auch im Forum posten … als Beispielreferenz … wäre super
1 „Gefällt mir“
Leider wurde das mit der Banner-Card hier nicht weiterverfolgt. Ich finde diese aber sehr passend und versuche mich gerade daran. Das sieht schon sehr schön aus, nur leider viel zu groß:
Auf den GIThub-Seiten findet man Einstellungen wie
| Var name | Default value | Usage |
|---|---|---|
| –banner-card-error-color | var(–lumo-error-color) | Background color when there’s an error crashing the card |
| –banner-card-heading-size | 3em | The main heading of the card |
| –banner-card-entity-value-size | 1.5em | Entity value font size |
| –banner-card-media-title-size | 0.9em | Media player fonts title font size |
| –banner-card-button-size | 32px | Size of buttons |
| –banner-card-spacing | 4px | Base unit for spacing. Used in multiples many places |
| –banner-card-heading-color-dark | var(–primary-text-color) | The card measures your bg color to figure out to use dark or light text color |
| –banner-card-heading-color-light | #fff | The card measures your bg color to figure out to use dark or light text color |
Doch leider ist mir nicht klar, wie ich diese anwenden soll. Auch der Hinweis auf Home Assistant frontend - Home Assistant brachte mich nicht wirklich weiter.
Kann es sein, das ich ein eigenes Thema dafür erstellen muss. Falls dem so ist, wie mache ich das? Hat da jemand eine gute Tutorial-Seite?
Danke!
Ich habe es jetzt selber herausgefunden: Mit folgendem Eintrag in der Themes-Datei:
# Anpassungen für Banner-Card
banner-card-heading-size: "1.5em"
banner-card-entity-value-size: "1em"
banner-card-media-title-size: "0.5em"
banner-card-button-size: "15px"
banner-card-spacing: "1px"
banner-card-heading-margin: "5px"
Dadurch wird die Banner-Card entsprechend angepasst:
Hallo Christian_SU,
so in etwa wollte ich es auch immer haben.
Kannst du mir sagen wie das funktioniert mit den Gruppierungen in einem Balken.
Hallo gvundnv,
ehrlich gesagt weiß ich nicht was du mit “Gruppierungen in einem Balken” meinst. Vielleicht kannst du das etwas näher erklären.
Grundsätzlich kann ich nur folgendes sagen:
Ich habe es nicht geschafft die Änderungen im YAML-Code der Karte zu machen. Alle versuche mit Style sind kläglich gescheitert. Es scheint nur innerhalb eines Thema’s zu funktionieren (warum auch immer). Einfach im HA ein Thema für das Frontend bestimmen und dann die Themen-Datei um folgendes erweitern:
banner-card-heading-size: "1.5em"
banner-card-entity-value-size: "1em"
banner-card-media-title-size: "0.5em"
banner-card-button-size: "15px"
banner-card-spacing: "1px"
banner-card-heading-margin: "5px"
Wenn du Hilfe brauchst, dann melde dich.