FHEM Forum

FHEM => Frontends => fronthem / smartVISU => Thema gestartet von: ParaChris82 am 01 März 2016, 08:32:56

Titel: SmartVisu Icons und Widgets Farben ändern
Beitrag von: ParaChris82 am 01 März 2016, 08:32:56
Einen wunderschönen guten Morgen (der Montag ist ja zum Glück geschafft) :)

Seit ca. 1 Woche richte ich schon fleißig SmartVisu ein. Funktioniert auch alles soweit, nur bei einem Thema komme ich einfach nicht weiter seit Tagen.
Ich würde gerne Icons und vor allem Widgets verschiedene Farben geben.

Zum Bespiel verwende ich zum schalten der Funksteckdosen den "basic.flip".
Ein Traum wäre es wenn er im Zustand "off" die Farbe rot hätte und im Zustand "on" die Farbe grün.

{{ basic.flip(id, gad, txt_on, txt_off) }}

Kann mir vielleicht jemand einen Tipp geben wo und wie ich genau den Hex Farbcode einfügen muss?

und genau das selbe Spiel bei einem Icon, dass aber die Farbe nicht wechseln soll:

<img class="icon" src="{{ icon0 }}light_light.svg" />

Ich hoffe mir kann jemand helfen, wäre super!  :)

Vielen Dank im Voraus für eure Hilfe und Antworten.

Lg Chris
Titel: Antw:SmartVisu Icons und Widgets Farben ändern
Beitrag von: dev0 am 02 März 2016, 06:30:42
Wenn Du ein komplett neues Farbthema erstellen möchtest, dann wirst Du hier fündig:
https://code.google.com/archive/p/smartvisu/wikis/themeroller.wiki (https://code.google.com/archive/p/smartvisu/wikis/themeroller.wiki)
http://themeroller.jquerymobile.com/ (http://themeroller.jquerymobile.com/)

Wenn Du nur die Farben von einigen Symbolen ändern möchtest, dann solltest Du auf Smartvisu 2.8 wechseln. Der Autor hat angefangen das für Symbole einzubauen. Aber leider ist das (bis jetzt? ) nicht für alle Widgets umgesetzt. Für Dimmer, Switches und Dualswitches habe ich das selbst erweitert und veröffentlicht, da der Autor nicht geantwortet hat, ob er diese Erweiterung einbauen wird...
https://github.com/ddtlabs/smartvisu-widgets/tree/master/basic-devices (https://github.com/ddtlabs/smartvisu-widgets/tree/master/basic-devices)
https://github.com/Martin-Gleiss/smartvisu (https://github.com/Martin-Gleiss/smartvisu)

Alternativ zu sv 2.8 kannst Du auch die css tags selbst in Deiner visu.css ändern. Dazu untersuchst Du die Seite mit Tools wie Firebug, damit kannst Du Objekte "live" ändern und siehst die ids und classes. Danach kannst Du diese Änderungen in Deine visu.css eintragen.
https://addons.mozilla.org/de/firefox/addon/firebug/ (https://addons.mozilla.org/de/firefox/addon/firebug/)
https://wiki.selfhtml.org/wiki/CSS (https://wiki.selfhtml.org/wiki/CSS)
http://www.css4you.de/ (http://www.css4you.de/)
Titel: Antw:SmartVisu Icons und Widgets Farben ändern
Beitrag von: ParaChris82 am 02 März 2016, 08:26:47
WOW, vielen vielen Dank für die ausführlichen Erklärungen und den Links !!!  :)

Damit kann ich definitiv was anfangen. Jetzt muss ich nur noch schauen welche Methode ich nutze.

Viele Grüße Chris