fix: UI bug for user message to take available screen space

[jasbindar-singh]

PR for issue number #31

• Add a function to check available screen space left for the user message
• Set the height of the user-message wrapper parent height to the available space
• Set the max-height for the user-message to be 100% of parents height(So, if available user message height > available space then show scroll else take up the available space)

[TheShubham99]

Thanks for the PR.
I'll review it asap.

Few suggestions-

1. Follow the commit conventions.
   (You can have a look at previous commits)

I guess this is a UI bug fix so tag it as a fix:

2. Mention the issue in the PR description.

[jasbindar-singh]

Made the suggested edits.

[TheShubham99]

@jasbindar-singh
Good yet custom approach 👍

I am not sure if it will work on all types of screens. (especially the bigger screens)

ping @pollend :)

[jasbindar-singh]

@TheShubham99 Np, let me know if you have some suggestion, and what screen size did you test it on? And by bigger screen you emphasize on width or height?

[pollend]

Just kind of wondering why this needs to be done through javascript. seems like the top margin is just some percentage of the screen height. I think vh units are relative to a percentage of the viewport height. Might be a better way to accomplish the same affect without custom javascript.