Text with Icons Type 1
Text blocks paired with icons (style variant 1).

The documentation section allows flexible customization through two main parts: the section itself with its own settings, and the Blurb subsection which has additional options. You can add as many Blur sections as needed to build your content.
Section Settings
This part controls the overall layout and appearance of the documentation section:
Heading, Subheading, Description: You can add a main heading, a subheading, and a descriptive text to introduce the section.
Heading Alignment: Choose how the heading aligns—either left or center aligned.
Layout: Adjust the overall layout including:
Top Spacing: Choose the vertical spacing above the section; options include None, Small, Medium, Normal. The "None" option applies only on the home page.
Width: Select how the section stretches on the page:
Default: Standard width.
Boxed: Content is contained within a boxed layout.
Wide: Expands to wide screens (1440px and above).
Number of Columns: Define how many columns the section should display on desktop (from 2 up to 8) and on tablets (2 to 4). This controls the horizontal distribution of content blocks.
Blurb Settings
Each Blurb is a customizable content block within the section with specific formatting options:
Text Align: You can set the text alignment inside each Blurb—left or center.
Heading Size: Choose the heading size for the Blurb from Medium, Small, Extra Small to Small (note some overlap in options).
Icon Width: Adjust the icon size inside the Blurb, ranging from 20 to 100 pixels wide.
Show Icon Box: Toggle the display of a background box around the icon to highlight it.
Icon Box Roundness: Control the rounding of the icon box corners from 0px (square) to 10px (rounded).
Underline on Hover: Enable an underline effect on the text when hovered, adding interactive feedback.
Slider Settings
Enable slider
Activates the slider functionality. When enabled, the slider will be displayed; when disabled, no sliding effect occurs.
Dividing line
Controls the visibility of a dividing line separating slider components.
Options:
Show: Displays the dividing line between slider sections.
Hide (implied): No dividing line is shown.
Background
Configures the background appearance of the slider.
Options:
Background: Enables the use of a solid background color or image.
Hide, Color, Gradient, Image: Hides any background color gradient or image to show a plain background.
Hide: Completely hides the background, making it transparent or matching the parent container.
Colors
Customize colors for various slider elements. All default to Transparent unless set otherwise:
Base: The basic background or foundational color for the slider.
Accent: Highlights or accented color used in slider elements.
Lines: Color of lines or borders within the slider.
Blurb: Background or text color for the blurb or caption area.
Heading: Color for headings or titles inside the slider. Default is Transparent.
Heading link hover: Color change when hovering over links in headings.
Description: Text color for descriptions within slides.
Icon: Color applied to any icons used in the slider.
Icon box: Background or border color for icon containers.
Link: Default color for clickable links within the slider.
Link icon: Color for icons associated with links.
Link hover: Color for links when hovered over.
Link icon hover: Color for icons next to links when hovered.
Text box: Background or text color of any text box overlays on the slides.
Media button: Color for buttons related to media controls inside the slider (e.g., play, pause).
Slider elements
Slider arrows
Controls the visibility and color of navigation arrows on the slider. Default is Transparent but can be customized to fit the design.
Slider dots
Controls the pagination dots that indicate the slide number or position. Color and visibility can be configured here.
Slider dots and arrows
Controls the pagination dots and arrows together that indicate the slide number or position. Color and visibility can be configured here.
Mobile navigation
Controls the mobile slide with dots or without anything
Enable autoplay
You can set here the speed of autoplya in sectonds
It doesn't work in the theme editor. Once done with slide configuration, you may manually switch to the next slide using arrows.
Together, these options provide detailed control over both the overall section structure and the individual content elements, letting you tailor the documentation appearance precisely to your design needs. You can combine multiple Blurbs within a section for a rich and varied presentation.
Last updated