Maintain Preview / Editor Pane Ratios on Window Resize

Does it make sense to keep the ratio of the code editor and the preview pane to be the size set by the user? Currently it seems as though the code editor gets resized first, down to about 400px min width, and then the page preview gets resized.

Further and possibly related - when then page preview is scaled above 100% I don’t understand why there would be horizontal scrolling - especially on a page that has no content and a common viewport set like this.
<meta name="viewport" content="width=device-width, initial-scale=1.0">

thoughts?

Thanks for the feedback!

The current rationale is that there’s some minimum size where code becomes too difficult to edit. I think at one point long ago HyperEdit evenly scaled but then moved to only scaling the web view on window resize. Whisk basically does this, but attempts to at least get 400px for the code. I’ve filed this and might make changes depending on if others voice a preference.

We’re doing the same type of zoom as in Safari - it just takes the view and magnifies/shrinks. This is more commonly implemented in browsers nowadays than a “text zoom.” Text zooms were more popular prior to iOS devices.

Because the preview view is a desktop view, meta viewport settings have no effect. Basically what you have in code is what you’ll get in a browser. So if you don’t set the viewport when you preview to iOS (via Hype Reflect or other means) you’ll get the exact result of your code without any messing with it under-the-hood. That said I am investigating a bug where the preview doesn’t look as I’d expect on iOS.

1 Like