[Gelöst] VIS Icon spiegeln?

[holgerwolf]

Hallo,

kann man in VIS ein Icon einfach spiegeln? Es gibt zwar die css transform Eigenschaft und ich habe rotate(180deg) und scale(-1) probiert, aber es passiert nix.

Danke
Holger

[holgerwolf]

Ich bräuchte da dochmal Hilfe. Sobald ich die Icons (müssen ja svg sein, sonst klappt das mit der Farbzuordnung nach Zustand sowieso nicht) mit einem Grafikprogramm (inkscape) bearbeite und wieder hochlade, klappt das mit der Farbzuordnung auch nicht mehr. Ich kenne mich mit den Vector basierten Zeichenprograme aber auch wirklich nicht aus.
Wie macht ihr das?

Danke
Holger

[OliverIO]

Wenn du eine svg Datei hast, kannst du die farben mit css nicht direkt beeinflussen.
Eine Alternative wäre das svg als Maske zu definieren und die Farbe dann mit der Hintergrundfarbe anzupassen.
Eine weitere Alternative wäre noch per JavaScript die Eigenschaften nach dem laden zu übertragen.
Und noch eine weitere habe ich als jquery gesehen. Das kopiert das svg in den dom nachdem die date geladen wurde. Dann kommt man auch wieder dran.

[holgerwolf]

@OliverIO
Danke, aber das ist alles nicht so einfach und zu viel Aufwand für ein seitenverkehrtes Dachfenster.

Gruß
Holger

[liv-in-sky]

ich habe mal das mit dem spiegeln probiert

habe das in css geschrieben und es hat funktioniert

mit :

ohne:

[liv-in-sky]

und weil durch zufall gefunden

mit css:

.anime { animation: turner 4s infinite linear !important}

@keyframes turner{
    from{  transform: rotateY(0deg)   }
    to  {  transform: rotateY(360deg) }
}

kann man dauernd drehen lassen:

[holgerwolf]

@liv-in-sky
Das klappt
Prima, sollte in ne FAQ

.turnImg {
  transform: scaleX(-1) !important;
}

Danke und Gruß
Holger

[sigi234]

Das ist auch interessant:

https://github.com/runsnbunsn/ioBroker.fontui

[holgerwolf]

@sigi234 Kenne ich. Aber da muss man mehrere Icons mit unterschiedlichen Stati und Farben übereinanderlegen. Da sind mir die fertigen Widgets schon lieber.