Overview

Slide out areas are available from your Palette, there are two types:

1. Collapsible Tile: A complete tile which expands to display additional content.
2. Sliding Draw: An area within a tile which expands to display additional content.

Setup

1. To use the slide out areas simply drag one from the palette onto your screen.
2. The slide out areas are hidden by default. To add content:
   1. Use the Layers section and navigate to the hidden area, content can then be dragged onto this area.
   2. Alternatively, lock your screen and expand the slide out area using the chevron. Now unlock your screen and the previously hidden area is now displayed ready to accept content.
3. If you need to move items after you have added them see Moving Components on a Screen.

Resizing

Collapsible Tiles

The collapsible tiles by default expand to 350px. This can be changed by:

1. Add a Collapsible Tile to your screen.
2. Click on the tile to open its Properties. 
3. Click the Styles tab.
4. In the CSS Properties section, double-click the style minWidth or minHeight depending on your tile:
5. change 350px to the desired size.
6. Save your changes.
7. It may be necessary to close and reopen the screen for the changes to take place

Sliding Draws

Unlock your screen and there is a dividing line between the sliding draw and the main area, simply drag this to the desired size. Lock your screen and test your proportions. 

Examples

Collapsible Tiles

Horizontal

Image Modified

Available from the Tiles section of your palette, these are designed to work where the tile container is set to row.

Image ModifiedVertical

These are designed to work where the tile container is set to column.

Sliding Draw

Available from the Tiles section of your palette, there are sliding draws for all axis: