Add scrollable fade to more info dialog

[timmo001]

Breaking change

Proposed change

Adds scrollable fade mixin to more info dialog. Also adds a scroll threshold to not instantly show the fade when scrolling through empty content

Screenshots

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

Additional information

• This PR fixes or closes issue: fixes #
• This PR is related to issue or discussion: Visually indicate there is scrollable content #28029 Inconsistent use of ha-scrollbar #28078
• Link to documentation pull request:

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io

[marcinbauer85]

Thanks @timmo001 for implementing and applying this component on a global scale! Does the ha-bottom-sheet also have this?
I'd like to also see a draft of us using the ha-bottom-sheet on mobile for the more-info, rather than a fullscreen dialog that I can only dismiss with the close button. The dashboard is pretty much the best case scenario where a easily dismissible "popup" would be useful to view and control stuff in your home.

[timmo001]

Thanks @timmo001 for implementing and applying this component on a global scale! Does the ha-bottom-sheet also have this? I'd like to also see a draft of us using the ha-bottom-sheet on mobile for the more-info, rather than a fullscreen dialog that I can only dismiss with the close button. The dashboard is pretty much the best case scenario where a easily dismissible "popup" would be useful to view and control stuff in your home.

It's actually just the more info dialog for now, I wasn't sure whether I should use this globally, it would probably make sense to do this, but for the webawesome variants, so bottom sheet would likely come into this.

On this note I think we would need to make the ha-wa-dialog swap to bottom sheet on a configurable basis to save on duplicated effort

Just made this to discuss: #28341