Reducing the gap between text nodes

#1

I seem to be totally missing how to do this. I want to remove the spacing between text nodes on the dashboard, this snip_20180619191410.

I've adjusted the different settings under Site --> Sizes but none of them seem to make a difference.

snip_20180619191449

Is it possible to reduce the gap, if so how, or am I stuck with it?

Thanks!

#2

make the vertical spacing smaller - say from 0 to 20

#3

Well… that’s one combination I didn’t try. However, after making the change which did work, it takes a form I have and compresses it where you are required to use scroll bars, any way around that?

#4

While some things (like background-color) could be controled by adding a ui-template node and adding some CSS to it, the height is controled by ‘ng-style’ that is dynamically created. I don’t know if there is a way to code a script in a ui-template node that could over ride it.

Here is an example of you you could change the background-color using a template node based on the ID and classes assigned to the elements:

[{"id":"93ef381e.4144","type":"ui_text","z":"bde3c158.f17cd","group":"8b5360d3.601e88","order":1,"width":"7","height":"1","name":"","label":"Alarm Status","format":"{{msg.payload}}","layout":"row-spread","x":510,"y":120,"wires":[]},{"id":"348ec6f.692b63a","type":"ui_text","z":"bde3c158.f17cd","group":"8b5360d3.601e88","order":2,"width":"7","height":"1","name":"","label":"Time Remaining","format":"{{msg.payload}}","layout":"row-spread","x":510,"y":200,"wires":[]},{"id":"5da9a619.f01b58","type":"inject","z":"bde3c158.f17cd","name":"","topic":"","payload":"Disarmed","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":270,"y":120,"wires":[["93ef381e.4144"]]},{"id":"630c161b.7e14a8","type":"inject","z":"bde3c158.f17cd","name":"","topic":"","payload":"0","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":260,"y":200,"wires":[["348ec6f.692b63a"]]},{"id":"ded86e48.f198a","type":"ui_template","z":"bde3c158.f17cd","group":"8b5360d3.601e88","name":"","order":0,"width":0,"height":0,"format":"// note: the borders are just for visually \n// seeing what each element covers\n<style>\n#Alarms_Group_1  {\n    border: solid 1px black;\n}\n#Alarms_Group_1_cards  {\n    border: solid 3px red ;\n    height: 40px !important;\n}\n#Alarms_Group_1_cards .nr-dashboard-text {\n    background-color: blue;\n    height:20px !important;\n    border: solid 5px green;\n}\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"global","x":380,"y":40,"wires":[[]]},{"id":"8b5360d3.601e88","type":"ui_group","z":"","name":"Group 1","tab":"c7a0c083.e3e848","order":1,"disp":true,"width":"7","collapse":false},{"id":"c7a0c083.e3e848","type":"ui_tab","z":"","name":"Alarms","icon":"dashboard","order":1}]
#5

Ah Ha! I figured it out. You have to set the CSS 'position' of the nr-dashboard-text in the group to 'static'. Here is an example with two tabs showing the css that will only effect one of the tabs:

[{"id":"bcc301e2.996758","type":"ui_text","z":"4cd4f4f3.7effcc","group":"f03bcc4.355aa3","order":1,"width":"7","height":"1","name":"","label":"Alarm Status","format":"{{msg.payload}}","layout":"row-spread","x":390,"y":140,"wires":[]},{"id":"89ecd5f7.6159b8","type":"ui_text","z":"4cd4f4f3.7effcc","group":"f03bcc4.355aa3","order":2,"width":"7","height":"1","name":"","label":"Time Remaining","format":"{{msg.payload}}","layout":"row-spread","x":390,"y":220,"wires":[]},{"id":"cb4a4780.37f128","type":"inject","z":"4cd4f4f3.7effcc","name":"","topic":"","payload":"Disarmed","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":150,"y":140,"wires":[["bcc301e2.996758"]]},{"id":"f0411449.136a7","type":"inject","z":"4cd4f4f3.7effcc","name":"","topic":"","payload":"0","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":140,"y":220,"wires":[["89ecd5f7.6159b8"]]},{"id":"cd068ce9.16809","type":"ui_template","z":"4cd4f4f3.7effcc","group":"f03bcc4.355aa3","name":"","order":3,"width":0,"height":0,"format":"// note: the borders are just for visually \n// seeing what each element covers\n<style>\n#Alarms_Group_1  {\n    xborder: solid 1px black;\n}\n#Alarms_Group_1_cards  {\n    xborder: solid 3px red ;\n    height: 40px !important;\n}\n#Alarms_Group_1_cards .nr-dashboard-text {\n    xbackground-color: blue;\n    xborder: solid 5px green;\n    height:20px !important;\n    position: static;\n}\n</style>\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"global","x":260,"y":60,"wires":[[]]},{"id":"526a9f2.c56c66","type":"ui_text","z":"4cd4f4f3.7effcc","group":"1d5a4116.5c9cc7","order":1,"width":"7","height":"1","name":"Alarm Status 2","label":"Alarm Status 2","format":"{{msg.payload}}","layout":"row-spread","x":380,"y":320,"wires":[]},{"id":"4943a5ab.d5ba8c","type":"ui_text","z":"4cd4f4f3.7effcc","group":"1d5a4116.5c9cc7","order":2,"width":"7","height":"1","name":"Time Remaining 2","label":"Time Remaining 2","format":"{{msg.payload}}","layout":"row-spread","x":380,"y":400,"wires":[]},{"id":"3a464850.938ab8","type":"inject","z":"4cd4f4f3.7effcc","name":"","topic":"","payload":"Disarmed","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":130,"y":320,"wires":[["526a9f2.c56c66"]]},{"id":"a7f03dfe.20951","type":"inject","z":"4cd4f4f3.7effcc","name":"","topic":"","payload":"0","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":120,"y":400,"wires":[["4943a5ab.d5ba8c"]]},{"id":"f03bcc4.355aa3","type":"ui_group","z":"","name":"Group 1","tab":"abe23ae3.9bbb68","order":1,"disp":true,"width":"7","collapse":false},{"id":"1d5a4116.5c9cc7","type":"ui_group","z":"","name":"Group 2","tab":"eb8ce6b7.5818c","order":1,"disp":true,"width":"6","collapse":false},{"id":"abe23ae3.9bbb68","type":"ui_tab","z":"","name":"Alarms","icon":"dashboard","order":4},{"id":"eb8ce6b7.5818c","type":"ui_tab","z":"","name":"Alarm 2","icon":"dashboard","order":3}]
#6

Awesome! Sorry for the delay in responding been working late these days. I will try this and let you know results. Thanks for looking into this!!

#7

And you were correct. thanks for the help!!