Tairo Layouts are provided by dedicated layers, allowing you to opt-in for the layouts you need. Each layout has its own set of components, composables, configuration and dependencies.
Layout layers reside in the layers/
directory of the Tairo repository. Here is a list of available layout layers:
Choose a layout
You can choose a layout that fits your project requirements. Each layout has its own navigation experience.
tairo-layout-sidebar Default layout used on the demo app. + pro: large number of navigation items | |
tairo-layout-collapse + pro: well balanced navigation | |
tairo-layout-topnav + pro: wide screen content - con: few number of navigation items | |
tairo-layout-iconnav + pro: wide screen content - con: low number of navigation items |
Add the layout to your project
Depending if you are running from source or with github layers, you can add the layout to your project. Note that you can add as many as layout as you need.
Create the default layout
By creating the default layout, every pages will use this layout unless specified otherwise.
Configure the layout
Each layers has its own configuration, you can find more information in the dedicated layout documentation.
Update the default app component
Replace the welcome message with the layout component.
Done!
You have successfully added a layout to your project. You can now create your first page.
Useful resources: