Icon Selector
Icon Selector is a component designed for adding a decorative icon on a page, typically used next to the Title component or alongside additional text. Icons used are from the Font Awesome Library.
The Icon Selector component allows you to choose an icon to display to the user that helps visually enhance the information it is paired with.
Configuring the Properties Tab
- Icon Selector: Select an icon from the FontAwesome Library using an interactive GUI dropdown.
- Is Decorative?: When checked, marks the Icon as decorative only for assistive technologies.
- Aria Label: If the Icon is not decorative, enter an aria-label that helps describe the icon's function.
Configuring the Styles
- Size: Choose between Small, Medium, Large, or Extra Large Icon sizes.
- Color: Choose between White, Theme (Dark Blue), or Black for the Icon color.
- Alignment: Choose between Left, Center, and Right for the Icon alignment.
Examples
Small & Theme Color & Left Aligned
Medium & Theme Color & Left Aligned
Large & Theme Color & Left Aligned
Extra Large & Theme Color & Left Aligned
Small & Black & Right Aligned
Medium & Black & Right Aligned
Large & Black & Right Aligned
Extra Large & Black & Right Aligned
Small & White & Center Aligned
Medium & White & Center Aligned
Large & White & Center Aligned
Extra Large & White & Center Aligned