Resolve "Persistent banner creates problem for web ide"

What does this MR do?

Updates the body layout of the Web IDE to use flexbox. This helps maintainability by simply letting the browser automatically adjust the height of the Web IDE.

Notes:

• EE Port (gitlab-ee!6923)
• This MR also refreshes the height of the editor when flash is closed
• This MR also refactors some of the flexbox styling using bootstrap utility classes

Screenshot

What are the relevant issue numbers?

Closes #46591 (closed)

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• Documentation created/updated
• Tests added for this feature/bug
• Conforms to the code review guidelines
• Conforms to the merge request performance guidelines
• Conforms to the style guides
• Conforms to the database guides