Issue with template node

#1

Hello,

I have a question about the use of the dashboard template node.
I have a template that contains some code to set a switch, (I can not use the dashboard switch node for this because of some custom stuff)
here is the code that is in the template:

<div layout="row" layout-align="space-between center">
    <p>test switch</p>
    <md-switch aria-label="test" ></md-switch>
</div>

When I set the size of the node to auto, it looks like this (used two template nodes here with the exact same code for clearity):

26

Which is a bit on the high side :slight_smile:.
However, when I set the size of the node to 6x1 it looks like this:

17

Got two bonus scroll bars on the right side.

This seems to be caused by the overflow-y: auto setting of the nr-dashboard-template CSS class. Removing that setting (using Chrome's developer mode) turns it into this:

16

Which is fine.
So, to cut a long story short.. how can I roll my own app.min.css to fix this, or is there another way ?

(running latest version of Node-red on Armbian 5.38)

0 Likes

#2

why not add the css direct to your template div ?

0 Likes

#3

Because that doesn’t help, the overflow-y: auto set of its parents md-card keeps adding the scrollbars.

0 Likes

#4

ok - just restyle the card then… -

eg related enough to be similar - Removing or making the ui_text not have a background color

0 Likes

#5

Good idea! I’ll give that a go, thanks!

0 Likes

#6

Worked like a charm!

0 Likes