UI Text box line size or vertical spacing

I'm using a lot of text boxes to show ping-response status, but the box seems to take up twice the space I need. In the attached, I could fit another entry in each of the gaps between text lines.

Is there a way to shrink the vertical textbox size? I did use the sizing property to specify 1 line, but that still comes out a bit large.
image

Why not have one template node, and create a table. You can style the table as you see fit and pad the cells.
e.g

[{"id":"72ac053c.5db6e4","type":"inject","z":"bf9e1e33.030598","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"600","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"[{\"host\":\"192.168.1.121\",\"name\":\"Rear garden\"},{\"host\":\"192.168.1.122\",\"name\":\"Balcony\"},{\"host\":\"192.168.1.124\",\"name\":\"Garage\"}]","payloadType":"json","x":35,"y":140,"wires":[["8744d611.2a1d18"]],"l":false},{"id":"8744d611.2a1d18","type":"ping","z":"bf9e1e33.030598","protocol":"Automatic","mode":"triggered","name":"","host":"","timer":"20","inputs":1,"x":95,"y":140,"wires":[["274eea9d.b14e7e"]],"l":false},{"id":"274eea9d.b14e7e","type":"join","z":"bf9e1e33.030598","name":"","mode":"custom","build":"array","property":"ping","propertyType":"msg","key":"topic","joiner":"\\n","joinerType":"str","accumulate":false,"timeout":"","count":"10","reduceRight":false,"reduceExp":"","reduceInit":"","reduceInitType":"","reduceFixup":"","x":430,"y":160,"wires":[["e6bd263c.6b865"]]},{"id":"e6bd263c.6b865","type":"ui_template","z":"bf9e1e33.030598","group":"17a74157.c8f20f","name":"HTML template","order":1,"width":0,"height":0,"format":"<style>\ntable{\n    background:grey;\n    border: 1px;\n    padding: 2px;\n}\nth, td{ \n    text-align: left;\n    border: 1px;\n    padding: 2px;\n}\n\n</style>\n\n<div class=\"main\">\n<table style=\"width:100%\">\n  <tr ng-repeat=\"TR in msg.ping\">\n    <td>{{TR.name}}</td>\n        <td>{{TR.online = true ? \"up\" : \"down\"}}</td>\n </tr>\n</table>\n</div>","storeOutMessages":true,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","className":"","x":600,"y":160,"wires":[[]]},{"id":"17a74157.c8f20f","type":"ui_group","name":"Recipe","tab":"acb040c7.bb7b5","order":4,"disp":false,"width":22,"collapse":false,"className":""},{"id":"acb040c7.bb7b5","type":"ui_tab","name":"Calculator","icon":"dashboard","disabled":false,"hidden":false}]

Add your devices in the inject node.

1 Like

Thanks, I will experiment and see how that works out. The template node scared me a little... :grin: :grin:

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.