Frontend: Integration settings dialog should be scrollable (option are displayed below dialog)

[Misiu]

The request

Currently when changing integration settings (via gear icon), when there are a lot of options some of them are not visible and displayed below the dialog:

As you can see some options are not visible, same with the save button.
I'd like to ask for adding a scrollbar if options don't fit on the screen so that we always have the SUMBIT button visible.

The alternatives

I must change the zoom to 80% in Chrome to see all the options:

Additional information

This is easy to reproduce in ShellyForHass 0.1.7-beta.2

[hakana]

Would it also be possible to compact the dialog, now there is a lot of extra space between rows?

[Misiu]

each paper-checkbox has fixed padding:
https://github.com/home-assistant/frontend/blob/9c407caf2ce6179448a3633e59a3d058b4a5db53/src/components/ha-form/ha-form-boolean.ts#L55

that's the reason for extra space. I can remove it, but not sure where it is used (don't want to break anything.) A quick search showed only single usage: https://github.com/home-assistant/frontend/search?q=ha-form-boolean&unscoped_q=ha-form-boolean

view editor dialog is using paper-dialog-scrollable. Is should be used here to allow scrollbar when needed

[bramkragten]

@hakana you locked the other issue, so I could not respond. But HA does have multi select for settings. Check for example plex: https://github.com/home-assistant/core/blob/dev/homeassistant/components/plex/config_flow.py#L287 or Unifi https://github.com/home-assistant/core/blob/dev/homeassistant/components/unifi/config_flow.py#L210

[Misiu]

@chemelli74 could you reopen https://github.com/StyraHem/ShellyForHASS/issues/209?

[chemelli74]

@chemelli74 could you reopen StyraHem/ShellyForHASS#209?

Done

Simone

[hakana]

I will check!

[bramkragten]

Duplicate of https://github.com/home-assistant/frontend/issues/5103