Content Controls
Content
This section provides controls for the user to dynamically create and modify a list, allowing individual customization of text, icons, and links for each list item.
- List – Allows you to create and organize the items in your icon list.
- Text – Define the text for each item in your list.
- Icon – Choose an icon to accompany each item in your list, providing a visual representation.
- Link – Optionally link your list items to other resources or pages for additional information.
Design Controls
Icon
This section is dedicated to the detailed customization of the icons in your list, including their position, size, color, and more, offering unique and personalized visual cues for your content.
- Position – Determine the placement of your icon relative to the text.
- Size – Adjust the size of the icons to ensure they align with your overall design language.
- Color – Change the color of your icons to match your site’s theme or to convey unique meanings.
- Background – Choose whether your icons should have a background color.
- Fill – Select a fill color for your icons’ background (only available when the background is enabled).
- Padding – Add space around your icon, inside the boundary of its background (only available when the background is enabled).
- Radius – Round the corners of your icon’s background for a softer, modern look (only available when the background is enabled).
- Nudge – Make precise adjustments to the icon’s position.
- Vertical – Nudge your icon up or down.
- Horizontal – Nudge your icon left or right.
Layout
Here, you can control the overall layout of your list, influencing how the elements are organized, spaced, and aligned, thus impacting the readability and visual flow of your content.
- Width – Set the width of your list to better fit your page design.
- Text Indent – Control the indentation of your text, helping to establish a clear hierarchy and readability.
- Space Between – Adjust the space between items in your list for better clarity and separation.
- Stack – Choose how your list items stack: horizontally or vertically.
- Horizontal Align – Align your list items left, center, or right when they are in a horizontal stack (only available when the stack is set to horizontal).
- Stack Vertical At – Decide at what breakpoint your horizontal list should stack vertically for better mobile responsiveness (only available when the stack is set to horizontal).
- Alignment When Vertical – Control the alignment of your list items when they are stacked vertically.
Typography
Enhance the text in your list through various typographic controls, allowing for a more readable and aesthetically pleasing presentation.
Spacing
Adjust the space around your list to integrate it seamlessly into your page layout, ensuring balance and consistency throughout the design.
- Margin Top – Add space above your list to balance the element within the page layout.
- Margin Bottom – Add space below your list to ensure it doesn’t feel cramped and maintains visual flow.
