Section & Variations › Feature

Available Parameters
Parameter Type Description
variation Text
required
Default : feature-variation-1 		Set variation for Feature section.
List of available variations :
  • feature-variation-1
  • feature-variation-2
  • feature-variation-3
title Text
required 		Set title for Feature section.
description Text
required 		Set description for Feature section
items Array of Features Item
required 		Set list of Features item.
Example:
[
    {
        "icon"    : "ic-cpu light-2",
        "text"    : "Powerful dashboard",
    }
]
image Filename Set image for Feature section.
The value is name of image file in the src/assets/images/ folder.
Available Variations
Starter Kit Codes 
{# include sections/feature  #}
{% include "sections/feature.twig", with {
    	"variation"	: "feature-variation-1",

	"title"		: "We make it effortlessly to track all user analytics",
	"description"	: "The customer journey differs for everybody—whether you use them together or on their own, our products are flexible enough to pave the path that’s best for you.",

	"items"		: [
		{
			"icon"	: "ic-cpu light-2",
			"text"	: "Powerful dashboard",
		},
		{
			"icon"	: "ic-refresh light-2",
			"text"	: "Always in Sync",
		},
	],

	"image"		: "feature-image-1.png"
  } %}
Section Preview Feature Variation 1
Starter Kit Codes 
{# include sections/feature  #}
{% include "sections/feature.twig", with {
    	"variation"	: "feature-variation-2",

	"title"		: "Collaborate with your team anytime, anywhere",
	"description"	: "See which work apps your team is working in, and join them with a click. Shared cursors equals better than screen-sharing.",

	"items"			: [
		{
			"text"	: "Organize your data",
		},
		{
			"text"	: "Always in sync",
		},
		{
			"text"	: "Work with any team",
		},
		{
			"text"	: "Embedded analytics",
		},
		{
			"text"	: "Business analytics",
		},
	],

	"image"		: "feature-image-2.png"
  } %}
Section Preview Feature Variation 2
Starter Kit Codes 
{# include sections/feature  #}
{% include "sections/feature.twig", with {
    	"variation"	: "feature-variation-3",

	"title"		: "Custom report that guides your decision-making",
	"description"	: "The customer journey differs for everybody—whether you use them together or on their own, our products are flexible enough to pave the path that’s best for you.",

	"items"			: [
		{
			"value"	: "1.4%",
			"text"	: "User base growth",
		},
		{
			"value"	: "22%",
			"text"	: "Increase in retention",
		},
	],

	"image"		: "feature-image-3.png"
  } %}
Section Preview Feature Variation 3