Dashboard tips - Bigger icon for button (dynamic)
Icons in buttons can be sized by adding class fa-2x But limited to max fa-5x By using custom class you can change icon size freely. Also you can change/add classes on fly by using msg.ui_control to create dynamic control for button appearance.
[{"id":"86dce912.04f0a8","type":"ui_button","z":"34b4a5e.a6f4b5a","name":"","group":"357d373a.2d1478","order":0,"width":"3","height":"3","passthru":false,"label":"","tooltip":"","color":"","bgcolor":"","icon":"fa-male bigIcon","payload":"","payloadType":"str","topic":"","x":550,"y":380,"wires":[[]]},{"id":"cda848ce.b96c58","type":"ui_template","z":"34b4a5e.a6f4b5a","group":"357d373a.2d1478","name":"icon style","order":1,"width":0,"height":0,"format":"<style>\n .bigIcon{\n font-size:9em;\n transition: 1s;\n }\n .bigIcon.red{\n color:red;\n }\n \n</style>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"global","x":560,"y":320,"wires":[[]]},{"id":"34b25f13.91062","type":"inject","z":"34b4a5e.a6f4b5a","name":"inject","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":150,"y":360,"wires":[["8365ec1f.f4eaf"]]},{"id":"bab885f9.56dcf8","type":"inject","z":"34b4a5e.a6f4b5a","name":"inject","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":150,"y":400,"wires":[["e9b8f766.0ffc08"]]},{"id":"8365ec1f.f4eaf","type":"change","z":"34b4a5e.a6f4b5a","name":"","rules":[{"t":"set","p":"ui_control.icon","pt":"msg","to":"fa-male bigIcon","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":360,"wires":[["86dce912.04f0a8"]]},{"id":"e9b8f766.0ffc08","type":"change","z":"34b4a5e.a6f4b5a","name":"","rules":[{"t":"set","p":"ui_control.icon","pt":"msg","to":"fa-male bigIcon red","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":400,"wires":[["86dce912.04f0a8"]]},{"id":"357d373a.2d1478","type":"ui_group","z":"","name":"Default","tab":"40d8b907.a41218","disp":true,"width":"6","collapse":false},{"id":"40d8b907.a41218","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]
