FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: stefan-dd am 18 September 2022, 22:07:21

Titel: [FTUI3] CSS überschreiben
Beitrag von: stefan-dd am 18 September 2022, 22:07:21
Ich möchte in der view-item.component.css die breite der Trennlinien ( background-size: 100% 2px;) verändern.
Wie mache ich das übergreifend für alle <ftui-view-item> Gruppen, ohne in der originalen CSS rum zu schreiben?

.inner {
  flex: 1;
  display: flex;
  align-items: inherit;
  background-image: linear-gradient(to bottom,var(--view-border-color), var(--view-border-color) 50%, transparent 50%);
  background-size: 100% 2px;
  background-repeat: no-repeat;
  background-position: bottom;
  padding-inline-end: var(--view-item-padding-end, 0em);
  min-height: inherit;
  position: relative;
}
Titel: Antw:[FTUI3] CSS überschreiben
Beitrag von: mr_petz am 21 September 2022, 17:12:08
Zitat von: stefan-dd am 18 September 2022, 22:07:21
...
..., ohne in der originalen CSS rum zu schreiben?
...

Da kommste zur Zeit nicht drumherum...
Nur mit extra js im Code, aber frisst dann Ressourcen...
Titel: Antw:[FTUI3] CSS überschreiben
Beitrag von: setstate am 22 September 2022, 21:31:05
das geht, wenn man dafür eine CSS-Variable einführt

background-size: var(--view-item-background-size, 100% 1px);


--view-item-background-size kann man dann im Theme festlegen oder direkt im HTML
Titel: Antw:[FTUI3] CSS überschreiben
Beitrag von: stefan-dd am 27 September 2022, 21:08:31
ok, Danke