Theme Customizer: Reduce reliance on fixed positioning and make sidebar UI flexible

[koopersmith]

Since the outer shell of the customizer uses fixed positioning, we can shift fewer elements by moving to absolute positioning, which allows better use of the "right" property (as it's set to the parent element instead of the window). This can allow the width to only be declared in two locations, so the sidebar becomes easily stretchable (and adjustable via JS).

Patch attached, tested in Chrome, Safari, Firefox, Opera, IE9, and IE8.

Latest patch adds corresponding RTL changes.

Hold the phone, helenyhou alerted me to another test case (overlays without sidebars; e.g. when opening the customizer).

Fixed in latest patch. The overlay used in customize-loader.js is not an overlay with a sidebar, so let's not use that container class.

Latest patch looks good to me in FF and Chrome (on a limited testing environment at the moment), LTR and RTL. With patch on #20800 applied, also looks good for the install themes previewer.

Patch looks good. For RTL, I increased the left value for .wp-full-overlay.collapsed .collapse-sidebar to prevent an overlapping of the button on the scrollbar.

Needs refresh.

Replying to ryan:

Needs refresh.

20799.5.diff​

In [20969]:

Theme Customizer: Reduce reliance on fixed positioning and make sidebar UI flexible. Props koopersmith, ocean90, helenyhou. fixes #20799