Component style settings
Component style settings set the look and feel of the component, typically color, margins, visibility, and so on.
- Margin
- Controls the spacing surrounding the component. You can set the margin individually, or for the entire component.
- Visibility
- Controls whether the component is visible. You can use this setting to hide parts of an app when displayed on smaller devices.
- Button style
- Controls the look and feel of the button.
- Hyperlink caret
- Enables you to set a forward/back arrow before/after your hyperlink.
- Label typography
- Controls text size.
- Label color
- Controls text color.
- Textbox style
- Enables you to switch the textbox between read only or editable.
- Chart style
- Controls the look and feel of your chart.
- Datagrid list
- Enables you to set the look and feel of the datagrid to a datagrid default or list default.
- Datagrid row height
- Sets the row height, to enable a more spacious/compact look and feel..
- Image position
- Enables you to center, stretch, or fill the image to the size of the flexbox.
- List style
- Enables you to select a cell/row template to use in your list, through which you can enhance your list entries with multiple pieces of information.
- Orientation
- Enables you to stack components vertically/horizontally in the flexbox/tab panel.
- Overflow
- Overflow set the behavior of a flexbox when its children does
not fit withing its available space.
- Hidden: Hides all components that do not fit into the available space.
- Scroll: Adds a scroll bar to the flexbox, so that you can scroll to find hidden components.
- Wrap: Wraps child components into the available space, depending on the orientation of the flexbox. If set to 'vertical', then the overflowing children are wrapped into new columns. If 'horizontal', then they are wrapped into new rows.
- Background color
- Controls the look and feel of the flexbox.
- Flexbox width
- Controls the width of the flexbox. If you set the width in pixels, then the size of the flexbox will not change, regardless of the screen size. To ensure that the flexbox width changes according to the screen size, set a relative width.
- Alignment
- Controls the placement of components. For example, set both horizontal and vertical alignment to center to ensure the component is centered correctly
- Padding
- Controls the space around the content of the flexbox.