Sections
A section is a row in the user interface – all components must be placed within a section. Sections can be subdivided to break up the screen. Each segment of the section contains a built-in container, into which subsequent controls can be placed.
The Layout property defines the segmentation of a row. There are six templates for segmenting a section, as seen below.
The Style property sets the default style of the section. The Default style will have no identifying style for that specific section. The well styles will share a uniform background and their size determines the amount of padding for these sections.
You can select Well styles such as Small, Medium or Large. The Panel option will make the container display like Card.
Users can customize the actual corresponding styles using Cascading Style Sheets (CSS) in the Stylesheet Designer.
Containers
A container is a subsection that can help subdivide a section into multiple vertical segments.
You can select a Well style from the Small, Medium, or Large options. The Panel option will make the container display like Card. After selecting Panel as style, Header and Footer inputs will appear where you can enter strings to be displayed on the header and footer sections of the container.
Users can customize the actual corresponding styles using Cascading Style Sheets (CSS) in the Stylesheet Designer.
The Color Style property sets the color style of the container.
By default, the styles match the color schemes:
- Default (Standard grey)
- Primary
- Primary 2
- Info
- Warning
- Warning 2
- Success
- Danger
Users can customize the actual corresponding styles using Cascading Style Sheets (CSS) in the Stylesheet Designer.