Centering group names

Dashboard
1

Hello,

I have been trying to center a group name above some icons, but whatever i try and searched the forums, no luck. Example:

image

Would this need a different approach? Thinking about adding a row above the icons and enter text and center that.

Thanks,

Ed.

2

Are you trying to center PIR? Can you provide your dashboard nodes?

3

Yes, it's PIR that needs to be centered. I'll try a workaround and if that fails i'll provide my nodes.

Ed.

4

When i add a row above the icons, it seems to solve what i want. But then it seems to push down the icons and the frame hight shows a difference.

image

I'll tinker a bit more with this.

Ed.

5

All right,

Adding a row above the left group fixes this, but that's not really what i wanted. The name "Locatie" is unneeded in my opinion. I could color it in the same color as the background, but that would be an awkward solution.

image

Allmost there though...

Ed.

6

Then you'll need to do it for every group. Add empty text row where header is not needed.

7

But then you'll get the situation showed with picture two. The word "Location" is unwanted but when i leave it empty the groups are no longer aligned.

Ed.

8

How about a space " " - so sort of empty....
Or if you don't mind all headings being centred... add a ui_template to the page with some CSS like

<style>
.nr-dashboard-theme ui-card-panel p.nr-dashboard-cardtitle {
    text-align: center;
}
</style>
9

Yep, the single space did the trick. Why didn't i think of that?

image

Thank you!

Ed.

10

Be advised that now you have all card titles centered :wink:

11

You mean horizontally for additional groups? Planning to add group for door switches.

Vertically they are aligned to the left.

Ed.

1 Like
12

Can you give an example as to how you do that? I tried but got zip....

13

Perhaps take a look on this node

I use this very often for similar purposes