[gelöst]Data-Icon bei push - kein Symbol bitte um Hilfe

[romibaer]

Hallo,
ich bin nun schon relativ lange an meinem Tablet UI am basteln - mit mehr oder weniger Erfolg.
Ich hänge an meiner Rollo-Steuern

Code Auswählen Erweitern


<li data-row="1" data-col="2" data-sizex="3" data-sizey="4">
    <header><div data-type="label" class="large">Rollos</div></header>
<div data-type="circlemenu" class="cell circlemenu">
    <ul class="menu">
      <li><div data-type="push" data-icon="fa-wrench"></div></li>
      <li><div data-type="push" data-device="Rollo_Essbereich_Terasse"
               data-set-on="pct 100"
               data-icon="">100</div></li>
      <li><div data-type="push" data-device="Rollo_Essbereich_Terasse"
               data-set-on="pct 75"
               data-icon="">75</div></li>
      <li><div data-type="push" data-device="Rollo_Essbereich_Terasse"
               data-set-on="pct 50"
               data-icon="">50</div></li>
      <li><div data-type="push" data-device="Rollo_Essbereich_Terasse"
               data-set-on="pct 25"
               data-icon="">25</div></li>
      <li><div data-type="push" data-device="Rollo_Essbereich_Terasse"
               data-set-on="pct 0"
               data-icon="">0</div>
    </ul>
</div>
<div data-type="push"
     data-device="Rollo_Essbereich_Terasse"
     data-cmd="set"
     data-set-on="pct 50"
     data-icon="fts_shutter_30"
     class="cell">
</div>
</li>


Das circle-Menu klappt soweit sehr gut, nur hätte ich gerne noch daneben einen Knopf, mit dem ich mit einem click den Rollo auf 50% fahre.
Der Befehl funktioniert auch soweit - leider wird mir das Symbol nicht angezeigt.
Kann mir hier bitte jemand weiterhelfen ?

Ich habe mich hier an das Wiki-gehalten und dachte ich kann das Icon einfach auswechseln - dem ist wohl nicht so bzw. mache ich wohl irgendwas falsch
Auf dem Screenshot ist mein Dilemma hoffentlich für euch nachzuvollziehen.

Viele Grüße

[setstate]

Hast du dieses Icon-Set im Header der Index.html eingebunden? Per Default sind nur fa-* Icons verfügbar.

[romibaer]

Sorry das sind meine ersten Gehversuche im Tablet Ui...
ich dachte das wären die Standard-Icons.
Habe im Webinterface bei dem Punkt set icon geschaut was es so zur Auswahl gibt und mir das ausgesucht.
Mit welchem Befehl bzw. Eintrag kann ich das in dee index.html zur Verfügung stellen?
Vielen Dank schonmal für die Mühe umd Hilfe

[setstate]

https://wiki.fhem.de/wiki/FHEM_Tablet_UI#Icon-Konfiguration

Code Auswählen Erweitern


  <link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
   <link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />




[romibaer]

Ja soweit ich das verstehe habe ich das so in der index.html drin stehen.
Hier ein Auszug aus meiner index.html

Code Auswählen Erweitern



<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
        <link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />



[setstate]

Wenn du ein fa-* Icon nimmst, geht es dann?

http://fontawesome.io/icons/

[romibaer]

Hi,
ja habe jetzt mal einfach fa-address-book genommen - das Icon wird angezeigt.
Ich habe mal meine index.html und die betreffende status.html angehangen - evtl. hilft das weiter.
Bin ratlos

[setstate]

Ich bin raus. Das kann vllt. jemand beantworten, der das anderen Icon-Set benutzt. Vielleicht heißt das Icon etwas anders. Bindestrich statt Unterstrich, oder prefix - fehlt oder zu neu im Fhem und fehlt noch im CSS.

[romibaer]

Ok - trotzdem Dir danke für die Mühe

[romibaer]

Der richtige code zum einbinden lautet:

Code Auswählen Erweitern


<div data-type="push"
     data-device="Rollo_Essbereich_Terasse"
     data-cmd="set"
     data-set-on="pct 50"
data-icon="oa-fts_shutter_30"
     class="cell">


[TWART016]

Die Fenstersymbole haben bei mir auch funktioniert. Andere von openautomation jedoch nicht, z.B.

Code Auswählen Erweitern

data-icon="oa-system_fhem"

[romibaer]

Das ist mir auch aufgefallen, dass nicht alle Symbole angezeigt werden.
Ich habe aber noch keine Lösung gefunden - ist eh noch so ziemlich alles Neuland für mich und vieles läuft mir try - error

Gruß