bisand / node-red-contrib-tibber-api

Node Red module for integrating with Tibber api
MIT License
20 stars 2 forks source link

node red UI change after ode-red-contrib-tibber-api install #89

Closed stasjminister closed 10 months ago

stasjminister commented 10 months ago

I have had this issue for some time, but I finally managed to reproduce it on a vanilla install with just node red and this palette component. I tried with other palette-items(not all..), but managed to reproduce the issue when installing this component and also verified that the issue was gone after it was uninstalled and the server was restarted.

Node red 16.0.2 tibber-api-version 6.0.0 (Issue has been there for over a year)

The issue: Before installing the component, the "Call Service Node" (might be affecting other nodes as well, but I have only seen this one affected) has all entities listed vertically beneath each other. It should not be related. But it is still affected..

image (11)

After install, the entities are listed horizontally, creating a long unmanageable list. image (7)

image (9)

image (12) image (10)

When uninstalling this component, and restarting the server. The entities are listed horizontally again. image (8)

I have tried to install some other components, but they do not cause this issue. please see images attached for details.

PS, I have parsed the page code. and found that disabling the "display: inline-block;" corrects the issue. But I do not think this is the right solution, as "display: inline-block;" is present on the working node, when this component is not installed. So this might be a false lead..

.select2-container--nodered .select2-selection--multiple .select2-selectionchoice .select2-container--nodered .select2-selection--multiple .select2-selectionchoice { border-bottom: 1px solid var(--red-ui-form-input-border-color); box-sizing: border-box; / display: inline-block; / max-width: 100%; overflow: hidden; padding: 4px 24px 4px 4px; position: relative; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; width: 100%; }

bisand commented 10 months ago

Thanks for reporting this! I have published a new version that should address this issue (v6.0.1). The config nodes contained some css styles that might have interfered with other nodes. This has been changed into inline styling and the css has been removed. Take it for a spin and let me know if this resolves your issue. Thanks!

stasjminister commented 10 months ago

Verified ok! Have not tested functionality, but the UI-issue is fixed. Thanks a lot!