Hallo,
ist es möglich den Hintergrund des Bereichs (grüner Pfeil) einzufärben, damit er sich vom eigentlichen Hintergrund (roter Pfeil) etwas abhebt?
Hallo,
ist es möglich den Hintergrund des Bereichs (grüner Pfeil) einzufärben, damit er sich vom eigentlichen Hintergrund (roter Pfeil) etwas abhebt?
Sofern ich Dich richtig verstanden habe: Nicht mit den “Boardmitteln” von HA, aber schau Dir mal
und ggf. auch noch
an.
VG Jim
danke für die Tipps, konnte jedoch bei Beiden keine Funktion finden, welche mir weiter hilft
Eine andere Hintergrundfarbe wäre schön (einen Tick heller), mir würde es aber auch schon eine Umrandung reichen (dort wo die punktierte Umrandungslinie verläuft).
Grund dafür ist, das ich mein Haupt-Dashboard sehr eng zusammen-quetschen muss, damit ich alles auf den Bildschirm (ohne scrollen) bringen möchte.
Könnte noch alles etwas enger machen, nur sieht es dann ohne anderen Hintergrund oder Umrandung etwas unübersichtlich aus.
Hm - dann habe ich entweder nicht verstanden was Du genau vor hast, oder Du hast Dir die Infos zu dem Card-Mod ggf. nicht richtig angeschaut.
Mit Card-Mod kannst Du Karten per
card_mod:
style: <STYLES>
farblich kompl. verändern. U.a. auch die Hintergrundfarbe und z.B. auch den Rahmen. Du kannst sogar die Farben abhängig von Ereignissen oder Status entsprechend verändern.
Wenn Du mal per Google z.B. nach home assistant card change background color suchst findest Du dazu jede Menge Infos und Beispiel. Auch welche hier im Forum denn der Card-Mod
wird von sehr vielen Usern genau dafür genutzt.
Falls Dir das wirklich nicht helfen sollte und das nicht das ist was Du suchst, dann verstehe ich leider nicht um welche Hintergründe es bei Dir genau geht.
VG Jim
Ich benutze es z. B. hier:
Das ist der Code dazu, CARD_MOD: ist der Trick! Hilft vielleicht sich einzuarbeiten… Ach so, ich benutze die MUSHROOM cards!!
type: custom:mushroom-template-card
primary: >-
Abgabe: {% set grid_feed =
states('sensor.sunny_boy_metering_power_supplied_safe') | int %}
{% if grid_feed > 0 %}
{{ "{0:,.0f}".format(grid_feed) | replace(',', '.',1) }} W
{% else %}
0 W
{% endif %}
card_mod:
style: |
ha-card {
background:
{% if states.sensor.sunny_boy_metering_power_supplied_safe.state | float > 0 %}
green
{% else %}
{% endif %};
}
secondary: >-
max heute: {% set grid_feed =
states('input_number.hochste_solarerzeugung_heute') | int %}
{% if grid_feed > 0 %}
{{ "{0:,.0f}".format(grid_feed) | replace(',', '.',1) }} W
{% else %}
0 W
{% endif %}
icon: mdi:transmission-tower-import
fill_container: false
tap_action:
action: none
hold_action:
action: none
double_tap_action:
action: none
icon_color: white
badge_color: null
badge_icon: null
Rahmen gehen auch ganz klasse. Wenn z. B. Autarkie=100%, dann gibt es einen grünen Rahmen um die Daten der Solaranlage.
Jepp das hatte ich @anon40834185 ja auch schon geschrieben, aber lt. seiner Aussage kann er ja - warum auch immer - mit dem Card-Mod nicht das umsetzen was er möchte. Aber vielleicht hilft es ja wenn es jetzt anhand Deines Beispiels hier das auch noch mal vor Augen hat. Ansonsten findet man - wie schon geschrieben - per Google Unmengen an Infos und Beispielen was man mit Card-Mod so alles anstellen kann.
VG Jim
Ist ja nicht ganz so einfach da rein zu kommen. Ich dachte mir, ein Beispiel hilft vielleicht. So kapiere ich am besten.
@RobertoCravallo - du veränderst Entitäten-Felder wie Buttons oder diverse andere Anzeige-Felder. Ich möchte aber den Bereich hinter diesen Felder (Buttons, etc.) einfärben.
Nur diesen Bereich wo die grüne Pfeilspitze hin zeigt aus meinem Screen… also zwischen den Buttons usw.
Aber auch nicht die ganze Seite sondern nur diesen Bereich wo bei mir z.B. das Schlafzimmer zusammengefasst ist.
Weiß nicht wie ich das erklären kann, damit es jeder versteht
Mit Cad-Mod konnte ich aktive Entitärenfelder bearbeiten aber nicht den Raum, der dahinter liegt.
Mein Freund Heinrich hat da ganz wildes gemacht. Icons und deren Hintergründe.
Vielleicht hilft Dir das weiter…
card_mod:
style: |-
mushroom-shape-icon {
--shape-color: none !important;
--shape-color-disabled: none !important;}
:host {
--mush-icon-symbol-size: 40px;
--mush-spacing: 5px; }
mushroom-badge-icon {
--icon-color: red;
--badge-icon-size: 12px;
--badge-size: 12px;
left: 34px;
top: 14px; }