Increase font size of Node Red table (Tabulator)

Dashboard
1

I would like to increase the font size in node-red-node-ui-table or node-red-contrib-ui-etable, both of which are based on Tabulator. I tried using the Template node, increasing the font size of the group that contains the table, but to no affect. I took a look at the file tabulator.min.css in etable's css folder and saw that the font-size was set to 14px. Changing that to a larger value did increase the font size. Is there a way to do this from the Template node? I hate to modify etable's css code. Is the problem that the entry in tabulator.min.css is overriding anything set by Template?

Thanks,
Tom

2

Add a UI template (set to head), add style tags & enter the necessary CSS.

3

My table is in the Options group in the Setup tab so I tried adding a template node with:

<style>
#Setup_Options > * {
    font-size: 24px;
}
</style>

But this did not work.

4

Is Setup_Options the id of the table?

You probably need to get a more specific selector for the table.

Use devtools to copy the selector

5

I found:
#ui_etable-796
but it looks like Node Red creates a new ID each time it is deployed.

6

The parent container won't. So you can grab the selector for that & use ..

.parent-container-selector > .table or whatever the element for take is.

I've don't use the id

7

This worked:

#Setup_Parameters_cards > md-card > .tabulator

8

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