This article ONLY works when using Avonni Creator. Only customers with an active subscription that was activated on or before December 31, 2021 have access to Avonni Creator.
This article is only valid when working on a Creator project.
Design a calendar
Final Result
How to?
Create the Layout
Drag a Layout of 3 columns
Set the Horizontal Alignment to Spread
Set the Vertical Alignment to Middle
Leave Gutters and Gutters Direct unchecked
Add chevrons on the left and right side
Add a button icon element
Variant: Bare
Size: Medium
Icon: Chevronleft and Chevronright
Add a radio button group element to display the months
Variant: Label hidden
Create a layout to display days of a week
Drag a Grid element
Set the manual layout to 7
Horizontal alignement: Full
Gutters: checked
Add text element to design days
Add Grid to highlight calendar content
Drag a Grid element with manual layout to 7 columns
Add a DIV element inside each column
Set a background color for the DIV element
Set a Height (e.g 54px)
Set a All sides padding spacing
Add a text element inside
Duplicate each DIV element for any other columns
Avonni Designer vs Avonni Builder comparison table
View all the differences between Avonni Designer and Avonni Builder.