Hi,
ist es möglich die Größe von data-warn bzw. fa-warn (roter Kreis + X) zu beeinflussen bzw. zu ändern?
Dieser wird ja durch die Größe des Symbol bzw. Push Widgets vorgeben, nur ist mir der Kreis manchmal zu groß.
Schön wäre es, wenn man die Größe als Parameter mitgeben könnte.
Grüße
Olli
Hallo zusammen,
stehe gerade auch vor dem Problem, die Größe des warn-Kreises unabhängig von der Icongröße anzeigen zu wollen.
Gibt es da eine Lösung?
VG
Marc
Da gibt es noch nichts. Könnte man aber bauen. Es ist in der Richtung aber eh noch was offen. Der rote Kreis soll sich horizontal verbreitern, wenn die Zahlen dreistellig werden. Aber ich habe aktuell gerade keinen Rechner, der ist zur Reperatur.
Danke für die schnelle Antwort.
Dann weiss ich Bescheid und kann mir die weitere Recherche sparen :-)
Dann drück ich mal die Daumen, dass der Rechner fix und vor allem heil wieder kommt.
VG
Marc
Die Größe der Warn Badges passen sich der Größe des Symbols an.
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>BIGGER</header>
<div class="center">
<div data-type="symbol" data-device="ftuitest" data-get="STATE" data-icon="fa-trash warn" data-background-icon="fa-circle" data-color="#222" class="bigger"></div>
</div>
</li>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
<header>BIG</header>
<div class="center">
<div data-type="symbol" data-device="ftuitest" data-get="STATE" data-icon="fa-trash warn" data-background-icon="fa-circle" data-color="#222" class="big"></div>
</div>
</li>
<li data-row="1" data-col="3" data-sizex="2" data-sizey="2">
<header>NORMAL</header>
<div class="center">
<div data-type="symbol" id="myElem" data-device="ftuitest" data-get="STATE" data-icon="fa-trash warn" data-background-icon="fa-circle" data-color="#222"></div>
</div>
</li>
man kann diese aber jetzt auch per CSS ändern individuell anpassen.
Im Header angeben
<style>
#myElem #warn {
font-size:0.4em;
}
</style>
Oder in der fhem-tablet-ui-user.css
Es sind jetzt auch Werte > 99 darstellbar. Die Breite passt sich flexibel an.
Klasse, vielen Dank.
Werde ich mir heute abend direkt mal anschauen.
Hallo setstate,
cool und danke für die Umsetzung.
Irgendwie bin ich gerade überfordert mit der Umsetzung in der fhem-tablet-ui-user.css.
html,
body,
main,
.symbol #warn {
font-size:0.4em;
}
Sorry für die blöde Frage ::)
In deinem Bsp. oben sind glaube ich ein paar "ddd" zu viel wie ddddata-map-class. Oder muss das so?
Mikka
Danke, ich habe aus dem Beispiel die unnötigen Teile rausgeworfen.
Hast du deine Symbole mit class="symbol" angelegt? Wenn nicht, wird dein Style nicht gezogen.
Entweder so:
[data-type="symbol"] #warn {
font-size:0.4em;
}
Oder so
[data-type="symbol"] #warn {
font-size:0.4em !important;
}
Ausserdem irritiert mich das
html,
body,
main,
Wenn das wirklich so drin steht, ist das falsch. Dann weglöschen.
Zitat von: setstate am 06 Februar 2018, 10:50:57
Danke, ich habe aus dem Beispiel die unnötigen Teile rausgeworfen.
Hast du deine Symbole mit class="symbol" angelegt? Wenn nicht, wird dein Style nicht gezogen.
Hatte ich nicht, danke.
Entweder so:
[code][data-type="symbol"] #warn {
font-size:0.4em;
}
Oder so
[data-type="symbol"] #warn {
font-size:0.4em !important;
}
Funktionier, klasse, DANKE!
Zitat
Ausserdem irritiert mich das
html,
body,
main,
Wenn das wirklich so drin steht, ist das falsch. Dann weglöschen.
Bin davon ausgegangen, dass das in die user.css rein muss. Ist nun raus.
Vielen Dank für deine Hilfe und die Tablet-UI!!!
Servus setstate,
prima Feature! Danke dafür.
Allerdings:
Geht das nur mir so, oder ist der Backgroundkreis bei einstelligen Zahlen bei Euch auch ein "Ei"?
Hi,
Zitat von: tomster am 21 Februar 2018, 15:35:55
Servus setstate,
prima Feature! Danke dafür.
Allerdings:
Geht das nur mir so, oder ist der Backgroundkreis bei einstelligen Zahlen bei Euch auch ein "Ei"?
kann ich bestätigen, man muss aber schon ganz genau hingucken :-)
Mikka
@setstate: Seit dem Update steht der Kreis höher als vorher über dem Symbol oder? Lässt sich dies evtl. einstellen?
Siehe Screenshots