[later phase] Total canvas size should be dynamic based on browser viewport size

Overview

The canvas is currently 10k² pixels. This means that it is possible to scroll WAY off to the corner of the canvas and then it's tricky to navigate back to the content.

Proposed resolution

The canvas size should be dynamically set. For the UX to feel nice and users not to feel limited, it needs to be big enough that you can scroll up/down/left/right far enough to almost scroll the preview's off the opposite side of the screen.

The calculation would need to take into account the size of the user's current browser viewport, the size of the left and top toolbars, the height of the tallest preview iFrame (the canvas must always be taller than the iframes) and the total size of all the preview viewports the user is viewing (the ability to show a dynamic number of viewport sizes is coming later).

Ideally it should automatically resize if the browser window is resized and also as the size of the iFrames increase/decrease as their content is changed or the number/size of viewports displayed is updated.

User interface changes

Example of the furthest amount a user should be able to scroll to the top left

Example of the furthest amount a user should be able to scroll to the bottom right