Intro to panes
In Polypane, each viewport is referred to as a pane. In horizontal and vertical layouts you can have as many of them as you need. In focus mode, you get a single pane in the center of your view. A pane consists of two parts: the viewport, where the page is shown, and the pane header, where you can set various properties of the pane.
Adding and removing panes
Removing and adding panes is easy in Polypane and can be done directly in the interface. To add a pane, you can either double click anywhere between panes to add a pane there, or
ctrl/cmd n to add one on the beginning of the list.
To delete a pane, hover over its title and a small
x will appear in the top left corner of a pane. Click it to delete the pane.
If you want to stress-test your website, press
shift ctrl/cmd n to randomly resize all visible panes.
Changing the order of panes
You can change the order of panes by using the arrows in the header of each pane. Hover over the header to show them. Clicking an arrow switches the pane with the one next to it. If you have
shift pressed while clicking, you switch with the first or last pane.
When you click into a pane, a blue bar at the top of the pane indicates that it is active. When a pane is active, keyboard input (like space and arrow keys) are sent to the pane rather than to the browser. To clear this, press
You can filter panes by type using the "filter" icon in the header.
The pane header
The pane header manages everything you do with a pane, though some features are hidden until you hover over them.
The top left of the pane header has a close button, and arrows to re-order panes
The bottom left of the pane header contains the title. Clicking on it reveals the Device presets. You can click on them, or use your arrow keys + enter to select one. You can also give your panes a custom name.
Finally, the bottom right of the header contains the size attributes of the pane. From left to right:
- Zoom Double click to fit the pane to the height of the application
- Height (can be left empty)
- Unit clicking on it switches from pixels to ems and back.
- Rotate. Only available if there is both a width and height. Click it to rotate the device.
Is your question not answered?
Ask via Twitter, Slack or our contact form