Responsive device previews in Live Preview

[bencroker]

The addition of device previews by @joshangell in #7375 was an excellent feature for content creators and the AX in Craft. I'd like to propose taking it a step further and allowing for a "responsive" layout that allows horizontal and vertical scaling of the iframe in which the preview exists.

To provide a visual, here is how this appears in Chrome when the device toolbar is toggled on. I believe that providing this functionality in live preview will not only help content creators in testing before publishing, but will pave the way for component designers (think of Storybook) to be constructed using Craft.

[mmikkel]

Good idea, hope to see this implemented!

Semi-related; #9754 – if/when the device previews get more flexible/powerful, I hope the ability to configure them in some manner is also introduced. Craft can be used to power pretty much anything, not just responsive web sites, and the out-of-the-box device previews aren't always a good fit, or relevant to the content being previewed.

[dennisfrank]

Yeah, that would be nice.

And if this gets implemented, I'd love to see responsive views that don't reload the entire page when you change viewports. This sometimes takes an uncomfortably long time for complex pages that are also not cached in the preview.