Bubble-Card globale Styles mit linear-gradient

[hawell]

Hallo zusammen,

ich bräuchte mal eure Hilfe da ich einfach nicht weiter komme die KI auch nur blösinn aufwirft.

ich habe eine Bubblecard bereits mit einen Styling verstehn. so weit so gut. nun möchte ich dass dieses Styling zum Globalen Style wird, und ich nicht in jeder Karte einzeln die CSS angaben machen muss. geht das? wenn ja wo/wie.

hier ist die Karte - ich scheitere immer an dem “linear-gradient” das bekomme ich in einen Theme nicht abgegildet.

type: custom:bubble-card
card_type: button
button_type: switch
sub_button:
  main: []
  bottom: []
entity: switch.relais_a
button_action:
  tap_action:
    action: more-info
show_state: true
grid_options:
  columns: 6
  rows: auto
icon: mdi:roller-shade
styles: |-
  .bubble-container {
    background-image: linear-gradient(
      to left,
      rgba(0, 0, 0, 1) 0%,
      rgba(7, 189, 223, 0.25) 100%
    );
    box-shadow: rgba(255, 255, 255, 0.05) 0 0 1px 1px inset;
  }

viele Grüße

Rico

[maxe]

Unter den Modulen kannst du ein neues “eigenes” Modul kreieren, dort dann dein CSS rein.
Das Modul kannst du dann bei allen gewünschten Bubble-Cards aktivieren.

[hawell]

Hallo, Danke für die Idee.

Eine Implementierung als preset oder Theme geht nicht?

Weil ein Modul bei jeder Karte zu aktivieren macht ja genauso viel Arbeit, wie wenn man den CSS code in den yaml der Karte kopiert.

Oder kann man die Module über mehrere Karten gleichzeitig aktivieren

[maxe]

Module lassen sich ja auch direkt für alle Karten aktivieren.

[hawell]

gute Idee, das hilft mir weiter.

danke!

[hawell]

Hallo,

ich muss das Thema nochmals aufrollen.

Wenn ich die Ecken der bubbleCard anpasse, sieht im Normalzustand alles gut aus, wenn ich die Karte (SwitchCard) aktiviere, passt die Rundung nicht mehr zum “Hintergrund” der Karte. In meinem Fall ist das Blau noch rund, während der Hintergrund eckig ist.

wo kann ich das einstellen, das beides gleich aussieht.