New This Month

This quality update brings canvas and layer panel improvements. We've updated the Component symbol throughout the app to differentiate it from Grids. Plus, we've made Primary Breakpoints and Variants more distinct in the left panel, making it easier to see if you're editing the primary or an instance. Breakpoints will now also show the ranges in the layer panel. See more updates below.

From January

Last month, we added support for automatic tinting and new layout options for components, plus a whole lot of fixes and improvements. If you give your Page a Fill color, this will now also tint browsers like Safari and will ensure you don't get plain white backgrounds when overscrolling on any mobile device. Plus, we've added support for Min Max sizing to all Smart and Code components, greatly simplifying many common layouts and patterns. See the full changelog below.

• We automatically set the body background, based on your Page's fill color

• You can now override the body background and customize per breakpoint

• We now support Min Max sizing for all Smart and Code Component

• We now consistently show the Min Max hint within the property panel

• You can now use all alignment options for layers with Position set to Fixed

• We now inform you if a parent layer height changes due to layout edits

• We improved the Radius and Padding controls, no longer resetting values

• Number inputs split in four no longer show steppers, so longer values fit

• We improved Appear Effects using Scale with Spring transitions

Adding Content to the Canvas

After setting up the content, go back to the canvas. Your collections are accessible from the Insert menu. Open the Insert menu, navigate to the CMS Content section, and drag and drop your collection onto the canvas. This will add a special stack with layers connected to your data. From here, you can edit the visual properties on the right, just as you would do with a regular Stack.

Add a Page with Content

If you wish to add a page instead that will automatically be populated with data from the CMS, navigate to the left panel. One you are in the Pages tab, click on the + button next to the CMS section. If you add the Index page, a page will be added with a list of all of the items in your collection. If you add the Detail page, you will be presented with a page with content from your individual items.

Note: If you chose to add the sample data, a new detail page called /blog will be added to your website, and you will find the stack of content added into the page for you.

The detail page will display content pulled from the first entry of the collection by default. In order to preview other items in the collection, change the content by selecting a different item from the dropdown menu.