Issue: Make Overlay JS Even Simpler

Just bumping this issue since we started using overlays for front-end help. With in-overlay navigation, it doesn't always resize correctly due to the current format requirements.

Marking this issue as In Progress. Overlay JS now requires the element HTML to be formatted with more generic vw-overlay- classes, rather than a list of cp- classes or random tags that might work. The following format is necessary to overlay correctly:

vw-overlay-block
-- vw-overlay-head
-- vw-overlay-form
-- -- vw-overlay-scrollable
-- -- -- vw-overlay-ctrl-row
-- -- -- -- vw-overlay-controls (optional)
-- -- vw-overlay-buttons

vw-overlay-block defines the container element of the overlay HTML. This is not the same as the vw-overlay element that the class uses more like a window container.
vw-overlay-head usually defines heading tags but it can really be any block HTML.
vw-overlay-form usually defines a physical form element
vw-overlay-scrollable defines the form controls or the real content of the overlay. This section will be compressed with a vertical scrollbar so that the entire overlay can fit it the browser window at one time.
vw-overlay-ctrl-row should be used on blocks within the scrollable element. It allows horizontal compression within the element to account for the extra width required by the scrollbar.
vw-overlay-controls (optional) should wrap the actual inputs within the vw-overlay-ctrl-row (e.g. if the inputs are in a right-hand column beside the labels).
vw-overlay-buttons defines the block containing form submission and/or cancel buttons.

vw-overlay-block, vw-overlay-head (and its children), vw-overlay-form, and vw-overlay-scrollable should not have vertical margins. Use padding instead. Margins on these elements can prevent the overlay from centering in the browser window.

vw-overlay-buttons is allowed a vertical margin on the top of the element.

Except for vw-overlay-controls, each overlay should utilize all of the classes, conforming to the hierarchy above. Doing otherwise can lead to an undesired appearance.

Marking this as completed in 4.1.x. While form buttons must still be manually handled (such as a form containing a Cancel button), the overlay JS now automatically creates a Close button which can be styled and positioned as desired by the platform. Working nicely in XF1 and 2 so far.