Theme option overlays dashboard components

[ThomasAndreini]

Current Behavior

when enough pages and groups are generated, some will fall behind the theme component

Expected Behavior

theme component does not overlap

Steps To Reproduce

create almost 13 element like page or group

Environment

• Dashboard version: 1.5.1
• Node-RED version: 3.1.5
• Node.js version: 18
• npm version:
• Platform/OS: docker
• Browser: Chrome
  

Have you provided an initial effort estimate for this issue?

I have provided an initial effort estimate

[colinl]

Clicking the Theming tab and returning to the Layout tab cures the problem temporarily.

[joepavitt]

Thanks for raising this, I've seen it in so many tutorials and videos online, but I've never been able to reproduce this locally - it's very annoying.

I'll add it to the list, and see if I can understand, without being able to reproduce, why it might be occuring.

[colinl]

Have you tried it with an example with several pages and lots of widgets?

[joepavitt]

Have you tried it with an example with several pages and lots of widgets?

My local test instance has 14 pages and about 140 widgets 😄

[colinl]

I will have a look later and see if I can find a pattern

[colinl]

I am seeing it in Chrome and Firefox running on Ubuntu. Nothing in the browser console.
NR 3.1.5, dashboard 1.4.1 running in a Pi and NR 4.0.0 Beta 1 with dashboard 1.5.1 both show the problem.
Not using Docker.

[ThomasAndreini]

I add that I am using node red via docker, also using the colinl trick the overlap disappears but if I select another tab, for example debug or context and go back to the dashboard tab the overlap return.
I don't think it's relevant but the only change made to the config file was to enable persistence for contexts

[m-schaeffler]

I have seen this on this setup:
dashboard: 1.6.1
nodered: 4.0.0 beta1
browser: firefox@ubuntu and firefox@win10