{
"observerUrl": "./preview/dist/pricing-table-observer.js",
"preferences": {
"previewUpdateTimeout": 0
},
"settings": {
"tabs": [
{
"id": "content",
"name": "Content",
"active": true
},
{
"id": "layout",
"name": "Style"
},
{
"id": "elements",
"name": "Elements"
}
],
"properties": [
{
"id": "mainColor",
"name": "Main skin color",
"tab": "layout",
"type": "color",
"defaultValue": "rgb(0, 131, 255)",
"description": "Set main skin color to color elements according to the selected skin."
},
{
"id": "styleColumnBorderRadius",
"name": "Round off column corners",
"tab": "layout",
"type": "toggle",
"defaultValue": true,
"description": "Turn on this option to make column edges rounded."
},
{
"id": "styleColumnBorderWidth",
"name": "Columns border",
"tab": "layout",
"type": "toggle",
"defaultValue": true,
"description": "Turn on this option to display column border."
},
{
"id": "layout",
"tab": "layout",
"type": "hidden",
"defaultValue": "columns"
},
{
"name": "Layout",
"tab": "layout",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Select one of the three predefined layouts. Columns features separate columns. Grid groups the columns together in a single block. Table displays a table structure complete with a table head."
},
{
"id": "skin",
"tab": "layout",
"type": "hidden",
"defaultValue": "skin5"
},
{
"name": "Skin",
"tab": "layout",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Skin defines the column elements to be colored in main color for each column. It's the fastest way to color the columns. Also there are color options available for each element to create a unique coloring."
},
{
"id": "head",
"name": "Head Column",
"tab": "content",
"type": "subgroup",
"visible": false,
"subgroup": {
"properties": [
{
"id": "headTitle",
"name": "Title",
"type": "text",
"defaultValue": "Plan name",
"allowEmpty": true,
"description": "Set the head column's title. The title will be displayed on the level with the titles of the rest of the columns."
},
{
"id": "headFeatures",
"name": "Features",
"type": "complex",
"complex": {
"properties": [
{
"id": "text",
"name": "Text",
"type": "textarea",
"textarea": {
"enableRichEdit": true,
"enableRichEditHtml": true
},
"defaultValue": "",
"description": "Enter the feature name."
},
{
"id": "hint",
"name": "Hint",
"type": "textarea",
"textarea": {
"enableRichEdit": true,
"enableRichEditHtml": true
},
"defaultValue": "",
"description": "Add a hint to provide your customers with additional information or provide a more detailed description of the feature. Hover on the question mark next to the feature name to display the hint."
}
]
},
"defaultValue": [
{
"text": "Feature 1"
},
{
"text": "Feature 2"
}
],
"description": "Set the names for the features to be displayed in the comparison table. Each feature name is displayed on the level with the corresponding feature in the table."
},
{
"id": "headTextColor",
"name": "Text Color",
"type": "color",
"defaultValue": "rgb(23, 25, 26)",
"allowEmpty": true,
"description": "Set the head column's text color."
},
{
"id": "headBackgroundColor",
"name": "Background Color",
"type": "color",
"defaultValue": "rgb(247, 247, 247)",
"allowEmpty": true,
"description": "Set the head column's background color."
}
]
}
},
{
"id": "columns",
"name": "Content",
"tab": "content",
"type": "complex",
"complex": {
"properties": [
{
"id": "titleGroup",
"name": "Title",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "title",
"name": "Title",
"type": "text",
"defaultValue": "Title",
"allowEmpty": true,
"description": "Set the columns title. As a rule, it's the name of your plan."
},
{
"id": "titleCaption",
"name": "Caption",
"type": "text",
"defaultValue": "",
"allowEmpty": true,
"description": "Set a short additional description as the title's caption. For example, you can say here who will profit the most from this plan."
}
]
}
},
{
"id": "featuresGroup",
"name": "Features",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "features",
"name": "Features",
"type": "complex",
"complex": {
"properties": [
{
"id": "text",
"name": "Text",
"type": "textarea",
"defaultValue": "",
"textarea": {
"enableRichEdit": true,
"enableRichEditHtml": true
},
"description": "Enter the feature description."
},
{
"id": "icon",
"name": "Icon",
"type": "select",
"select": {
"options": [
{
"value": "none",
"name": "None"
},
{
"value": "bulb",
"name": "Bulb"
},
{
"value": "check",
"name": "Check"
},
{
"value": "checkMarkCircle",
"name": "Check Mark in the Circle"
},
{
"value": "cross",
"name": "Cross"
},
{
"value": "crossCircle",
"name": "Cross in the Circle"
},
{
"value": "dash",
"name": "Dash"
},
{
"value": "dashCircle",
"name": "Dash in the Circle"
},
{
"value": "dot",
"name": "Dot"
},
{
"value": "info",
"name": "Info"
},
{
"value": "like",
"name": "Like"
},
{
"value": "love",
"name": "Love"
},
{
"value": "plus",
"name": "Plus"
},
{
"value": "plusCircle",
"name": "Plus in the Circle"
},
{
"value": "star",
"name": "Star"
},
{
"value": "stop",
"name": "Stop"
}
]
},
"defaultValue": "none",
"description": "Select feature icon from the list"
},
{
"name": "Hint",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Add a hint to provide your customers with additional information or provide a more detailed description of the feature. Hover on the question mark next to the feature text to display the hint."
}
],
"limit": 3,
"limitExceedHtml": ""
},
"description": "The list of features. You can list any feature or item, characteristic of the offer."
}
]
}
},
{
"id": "priceGroup",
"name": "Price",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "priceCurrency",
"name": "Currency",
"type": "select",
"select": {
"options": [
{
"value": "USD",
"name": "United States Dollars (USD)"
}, {
"value": "EUR",
"name": "Euro (EUR)"
}, {
"value": "GBP",
"name": "United Kingdom Pounds (GBP)"
}, {
"value": "CAD",
"name": "Canadian Dollars (CAD)"
}, {
"value": "AFN",
"name": "Afghan Afghani (AFN)"
}, {
"value": "ALL",
"name": "Albanian Lek (ALL)"
}, {
"value": "DZD",
"name": "Algerian Dinar (DZD)"
}, {
"value": "AOA",
"name": "Angolan Kwanza (AOA)"
}, {
"value": "ARS",
"name": "Argentine Pesos (ARS)"
}, {
"value": "AMD",
"name": "Armenian Dram (AMD)"
}, {
"value": "AWG",
"name": "Aruban Florin (AWG)"
}, {
"value": "AUD",
"name": "Australian Dollars (AUD)"
}, {
"value": "BBD",
"name": "Barbadian Dollar (BBD)"
}, {
"value": "AZN",
"name": "Azerbaijani Manat (AZN)"
}, {
"value": "BDT",
"name": "Bangladesh Taka (BDT)"
}, {
"value": "BSD",
"name": "Bahamian Dollar (BSD)"
}, {
"value": "BHD",
"name": "Bahraini Dinar (BHD)"
}, {
"value": "BIF",
"name": "Burundian Franc (BIF)"
}, {
"value": "BYR",
"name": "Belarusian Ruble (BYR)"
}, {
"value": "BZD",
"name": "Belize Dollar (BZD)"
}, {
"value": "BTN",
"name": "Bhutanese Ngultrum (BTN)"
}, {
"value": "BAM",
"name": "Bosnia and Herzegovina Convertible Mark (BAM)"
}, {
"value": "BRL",
"name": "Brazilian Real (BRL)"
}, {
"value": "BOB",
"name": "Bolivian Boliviano (BOB)"
}, {
"value": "BWP",
"name": "Botswana Pula (BWP)"
}, {
"value": "BND",
"name": "Brunei Dollar (BND)"
}, {
"value": "BGN",
"name": "Bulgarian Lev (BGN)"
}, {
"value": "MMK",
"name": "Burmese Kyat (MMK)"
}, {
"value": "KHR",
"name": "Cambodian Riel (KHR)"
}, {
"value": "CVE",
"name": "Cape Verdean escudo (CVE)"
}, {
"value": "KYD",
"name": "Cayman Dollars (KYD)"
}, {
"value": "XAF",
"name": "Central African CFA Franc (XAF)"
}, {
"value": "CLP",
"name": "Chilean Peso (CLP)"
}, {
"value": "CNY",
"name": "Chinese Yuan Renminbi (CNY)"
}, {
"value": "COP",
"name": "Colombian Peso (COP)"
}, {
"value": "KMF",
"name": "Comorian Franc (KMF)"
}, {
"value": "CDF",
"name": "Congolese franc (CDF)"
}, {
"value": "CRC",
"name": "Costa Rican Colones (CRC)"
}, {
"value": "HRK",
"name": "Croatian Kuna (HRK)"
}, {
"value": "CZK",
"name": "Czech Koruny (CZK)"
}, {
"value": "DKK",
"name": "Danish Kroner (DKK)"
}, {
"value": "DOP",
"name": "Dominican Peso (DOP)"
}, {
"value": "XCD",
"name": "East Caribbean Dollar (XCD)"
}, {
"value": "EGP",
"name": "Egyptian Pound (EGP)"
}, {
"value": "ETB",
"name": "Ethiopian Birr (ETB)"
}, {
"value": "XPF",
"name": "CFP Franc (XPF)"
}, {
"value": "FJD",
"name": "Fijian Dollars (FJD)"
}, {
"value": "GMD",
"name": "Gambian Dalasi (GMD)"
}, {
"value": "GHS",
"name": "Ghanaian Cedi (GHS)"
}, {
"value": "GTQ",
"name": "Guatemalan Quetzal (GTQ)"
}, {
"value": "GYD",
"name": "Guyanese Dollar (GYD)"
}, {
"value": "GEL",
"name": "Georgian Lari (GEL)"
}, {
"value": "HTG",
"name": "Haitian Gourde (HTG)"
}, {
"value": "HNL",
"name": "Honduran Lempira (HNL)"
}, {
"value": "HKD",
"name": "Hong Kong Dollars (HKD)"
}, {
"value": "HUF",
"name": "Hungarian Forint (HUF)"
}, {
"value": "ISK",
"name": "Icelandic Kronur (ISK)"
}, {
"value": "INR",
"name": "Indian Rupees (INR)"
}, {
"value": "IDR",
"name": "Indonesian Rupiah (IDR)"
}, {
"value": "NIS",
"name": "Israeli New Shekel (NIS)"
}, {
"value": "IQD",
"name": "Iraqi Dinar (IQD)"
}, {
"value": "JMD",
"name": "Jamaican Dollars (JMD)"
}, {
"value": "JPY",
"name": "Japanese Yen (JPY)"
}, {
"value": "JEP",
"name": "Jersey Pound (JEP)"
}, {
"value": "JOD",
"name": "Jordanian Dinar (JOD)"
}, {
"value": "KZT",
"name": "Kazakhstani Tenge (KZT)"
}, {
"value": "KES",
"name": "Kenyan Shilling (KES)"
}, {
"value": "KWD",
"name": "Kuwaiti Dinar (KWD)"
}, {
"value": "KGS",
"name": "Kyrgyzstani Som (KGS)"
}, {
"value": "LAK",
"name": "Laotian Kip (LAK)"
}, {
"value": "LVL",
"name": "Latvian Lati (LVL)"
}, {
"value": "LBP",
"name": "Lebanese Pounds (LBP)"
}, {
"value": "LSL",
"name": "Lesotho Loti (LSL)"
}, {
"value": "LRD",
"name": "Liberian Dollar (LRD)"
}, {
"value": "MGA",
"name": "Malagasy Ariary (MGA)"
}, {
"value": "MKD",
"name": "Macedonia Denar (MKD)"
}, {
"value": "MOP",
"name": "Macanese Pataca (MOP)"
}, {
"value": "MWK",
"name": "Malawian Kwacha (MWK)"
}, {
"value": "MVR",
"name": "Maldivian Rufiyaa (MVR)"
}, {
"value": "MXN",
"name": "Mexican Pesos (MXN)"
}, {
"value": "MYR",
"name": "Malaysian Ringgits (MYR)"
}, {
"value": "MUR",
"name": "Mauritian Rupee (MUR)"
}, {
"value": "MDL",
"name": "Moldovan Leu (MDL)"
}, {
"value": "MAD",
"name": "Moroccan Dirham (MAD)"
}, {
"value": "MNT",
"name": "Mongolian Tugrik (MNT)"
}, {
"value": "MZN",
"name": "Mozambican Metical (MZN)"
}, {
"value": "NAD",
"name": "Namibian Dollar (NAD)"
}, {
"value": "NPR",
"name": "Nepalese Rupee (NPR)"
}, {
"value": "ANG",
"name": "Netherlands Antillean Guilder (ANG)"
}, {
"value": "NZD",
"name": "New Zealand Dollars (NZD)"
}, {
"value": "NIO",
"name": "Nicaraguan Córdoba (NIO)"
}, {
"value": "NGN",
"name": "Nigerian Naira (NGN)"
}, {
"value": "NOK",
"name": "Norwegian Kroner (NOK)"
}, {
"value": "OMR",
"name": "Omani Rial (OMR)"
}, {
"value": "PKR",
"name": "Pakistani Rupee (PKR)"
}, {
"value": "PGK",
"name": "Papua New Guinean Kina (PGK)"
}, {
"value": "PYG",
"name": "Paraguayan Guarani (PYG)"
}, {
"value": "PEN",
"name": "Peruvian Nuevo Sol (PEN)"
}, {
"value": "PHP",
"name": "Philippine Peso (PHP)"
}, {
"value": "PLN",
"name": "Polish Zlotych (PLN)"
}, {
"value": "QAR",
"name": "Qatari Rial (QAR)"
}, {
"value": "RON",
"name": "Romanian Lei (RON)"
}, {
"value": "RUB",
"name": "Russian Rubles (RUB)"
}, {
"value": "RWF",
"name": "Rwandan Franc (RWF)"
}, {
"value": "WST",
"name": "Samoan Tala (WST)"
}, {
"value": "SAR",
"name": "Saudi Riyal (SAR)"
}, {
"value": "STD",
"name": "Sao Tome And Principe Dobra (STD)"
}, {
"value": "RSD",
"name": "Serbian dinar (RSD)"
}, {
"value": "SCR",
"name": "Seychellois Rupee (SCR)"
}, {
"value": "SGD",
"name": "Singapore Dollars (SGD)"
}, {
"value": "SDG",
"name": "Sudanese Pound (SDG)"
}, {
"value": "SYP",
"name": "Syrian Pound (SYP)"
}, {
"value": "ZAR",
"name": "South African Rand (ZAR)"
}, {
"value": "KRW",
"name": "South Korean Won (KRW)"
}, {
"value": "SSP",
"name": "South Sudanese Pound (SSP)"
}, {
"value": "SBD",
"name": "Solomon Islands Dollar (SBD)"
}, {
"value": "LKR",
"name": "Sri Lankan Rupees (LKR)"
}, {
"value": "SRD",
"name": "Surinamese Dollar (SRD)"
}, {
"value": "SZL",
"name": "Swazi Lilangeni (SZL)"
}, {
"value": "SEK",
"name": "Swedish Kronor (SEK)"
}, {
"value": "CHF",
"name": "Swiss Francs (CHF)"
}, {
"value": "TWD",
"name": "Taiwan Dollars (TWD)"
}, {
"value": "THB",
"name": "Thai baht (THB)"
}, {
"value": "TZS",
"name": "Tanzanian Shilling (TZS)"
}, {
"value": "TTD",
"name": "Trinidad and Tobago Dollars (TTD)"
}, {
"value": "TND",
"name": "Tunisian Dinar (TND)"
}, {
"value": "TRY",
"name": "Turkish Lira (TRY)"
}, {
"value": "TMT",
"name": "Turkmenistani Manat (TMT)"
}, {
"value": "UGX",
"name": "Ugandan Shilling (UGX)"
}, {
"value": "UAH",
"name": "Ukrainian Hryvnia (UAH)"
}, {
"value": "AED",
"name": "United Arab Emirates Dirham (AED)"
}, {
"value": "UYU",
"name": "Uruguayan Pesos (UYU)"
}, {
"value": "UZS",
"name": "Uzbekistan som (UZS)"
}, {
"value": "VUV",
"name": "Vanuatu Vatu (VUV)"
}, {
"value": "VEF",
"name": "Venezuelan Bolivares (VEF)"
}, {
"value": "VND",
"name": "Vietnamese đồng (VND)"
}, {
"value": "XOF",
"name": "West African CFA franc (XOF)"
}, {
"value": "YER",
"name": "Yemeni Rial (YER)"
}, {
"value": "ZMW",
"name": "Zambian Kwacha (ZMW)"
}
],
"enableInput": true
},
"defaultValue": "USD",
"allowEmpty": false,
"description": "Choose the currency."
},
{
"id": "price",
"name": "Price",
"type": "text",
"defaultValue": "0",
"allowEmpty": true,
"description": "Set the price."
},
{
"id": "priceCaption",
"name": "Caption",
"type": "textarea",
"textarea": {
"enableRichEdit": true,
"enableRichEditHtml": true
},
"defaultValue": "",
"allowEmpty": true,
"description": "Set the price caption - payment period, special offer, discount price, etc."
},
{
"id": "pricePrefix",
"name": "Price prefix",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set small price prefix."
},
{
"id": "pricePostfix",
"name": "Price postfix",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set small price postfix."
}
]
}
},
{
"id": "buttonGroup",
"name": "Button",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "button",
"name": "Button label",
"type": "text",
"defaultValue": "Select",
"allowEmpty": true,
"description": "Set the button label text."
},
{
"id": "buttonLink",
"name": "Button link",
"type": "text",
"defaultValue": "",
"description": "Set the link to redirect your user to after clicking on the button."
},
{
"id": "buttonTargetBlank",
"name": "Open link in new window",
"type": "toggle",
"defaultValue": true,
"description": "Set the button link target (new or current window)"
},
{
"id": "buttonCaption",
"name": "Caption",
"type": "text",
"defaultValue": "",
"allowEmpty": true,
"description": "Set the button caption. This text under the button can be used as an extra call to action."
}
]
}
},
{
"id": "pictureGroup",
"name": "Picture",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "picture",
"name": "Picture Url (3:2)",
"type": "file",
"defaultValue": "",
"description": "Paste the URL of the picture you want to display on your column. The picture's aspect ratio should be 3:2."
}
]
}
},
{
"id": "ribbonGroup",
"name": "Ribbon",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "ribbonText",
"name": "Ribbon text",
"type": "text",
"defaultValue": "",
"description": "Set the ribbon text. The ribbon is a visual element that will attract more attention to the column where it's placed."
},
{
"id": "ribbonBackgroundColor",
"name": "Background color",
"type": "color",
"defaultValue": "",
"description": "Set the ribbon background color."
},
{
"id": "ribbonTextColor",
"name": "Text color",
"type": "color",
"defaultValue": "",
"description": "Set the ribbon text color."
}
]
}
},
{
"id": "contentDivider",
"type": "divider"
},
{
"id": "settingsGroup",
"name": "Column settings",
"type": "subgroup",
"subgroup": {
"properties": [
{
"id": "mainColor",
"name": "Main skin color",
"tab": "layout",
"type": "color",
"defaultValue": "rgb(0, 131, 255)",
"description": "Set main skin color to color this column's elements according to the selected skin."
},
{
"name": "Featured column",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Use this option to highlight a column against the other ones. Hint: use it to highlight your most profitable plan."
}
]
}
}
],
"nameProperty": "title",
"limit": 3,
"limitExceedHtml": ""
},
"defaultValue": [
{
"title": "Lite Plan",
"titleCaption": "Individuals and small teams",
"features": [
{
"text": "Clean and easy to use app",
"icon": "check"
},
{
"text": "Simple widget generator",
"icon": "check"
}
],
"price": "9",
"priceCurrency": "USD",
"button": "Select",
"buttonLink": "https://elfsight.com",
"buttonCaption": "14-day money back guarantee"
},
{
"title": "Pro Plan",
"titleCaption": "Growing businesses",
"features": [
{
"text": "Clean and easy to use app",
"icon": "check"
},
{
"text": "Simple widget generator",
"icon": "check"
},
{
"text": "Neat dashboard with settings",
"icon": "check"
}
],
"price": "19",
"priceCurrency": "USD",
"button": "Select",
"buttonLink": "https://elfsight.com",
"buttonCaption": "14-day money back guarantee"
},
{
"title": "Enterprise Plan",
"titleCaption": "Advanced companies",
"features": [
{
"text": "Clean and easy to use app",
"icon": "check"
},
{
"text": "Simple widget generator",
"icon": "check"
},
{
"text": "Neat dashboard with settings",
"icon": "check"
}
],
"price": "29",
"priceCurrency": "USD",
"button": "Select",
"buttonLink": "https://elfsight.com",
"buttonCaption": "14-day money back guarantee"
}
],
"description": "Add the content to be displayed in each element of a column."
},
{
"id": "elements",
"name": "Elements",
"tab": "elements",
"type": "complex",
"complex": {
"duplicateAction": false,
"removeAction": false,
"addAction": false,
"properties": [
{
"id": "titleComplexGroup",
"complexGroup": "title",
"name": "Title",
"properties": [
{
"id": "titleEnable",
"name": "Show title",
"type": "toggle",
"defaultValue": true,
"description": "Turn on/off the title.",
"element": "title"
},
{
"name": "Title color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the title's text color.",
"element": "title"
},
{
"name": "Caption color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the caption's text color.",
"element": "title"
},
{
"name": "Font size (px)",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the title font size in pixels.",
"element": "title"
},
{
"name": "Font weight",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Select the title font weight.",
"element": "title"
}
]
},
{
"id": "featuresComplexGroup",
"complexGroup": "features",
"name": "Features",
"properties": [
{
"id": "featuresEnable",
"name": "Features",
"type": "toggle",
"defaultValue": true,
"description": "Turn on/off the features."
},
{
"id": "featuresAlign",
"name": "Align",
"type": "select-inline",
"selectInline": {
"options": [
{
"value": "left",
"name": "Left"
},
{
"value": "center",
"name": "Center"
}
]
},
"defaultValue": "left",
"description": "Select the features text align."
},
{
"name": "Style",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Select the features list style from the list. Clean displays the features only without any additional elements. Divided separates the features with lines. Striped displays the features list in a zebra pattern."
},
{
"name": "Icon color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the features icon color."
},
{
"name": "Text color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the features text color."
},
{
"name": "Font size (px)",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the features font size in pixels."
}
]
},
{
"id": "priceComplexGroup",
"complexGroup": "price",
"name": "Price",
"properties": [
{
"id": "priceEnable",
"name": "Price",
"type": "toggle",
"defaultValue": true,
"description": "Turn on/off the price."
},
{
"name": "Price color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the price text color."
},
{
"name": "Caption color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the price caption color."
},
{
"name": "Price font size (px)",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the price font size in pixels."
},
{
"name": "Font weight",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Choose the price font weight."
}
]
},
{
"id": "buttonComplexGroup",
"complexGroup": "button",
"name": "Button",
"properties": [
{
"id": "buttonEnable",
"name": "Button",
"type": "toggle",
"defaultValue": true,
"description": "Turn on/off the button."
},
{
"id": "buttonType",
"name": "Button type",
"type": "select-inline",
"selectInline": {
"options": [
{
"value": "outline",
"name": "Outline"
},
{
"value": "filled",
"name": "Filled"
}
]
},
"defaultValue": "outline",
"description": "Choose the button type."
},
{
"id": "buttonSize",
"name": "Button size",
"type": "select-inline",
"selectInline": {
"options": [
{
"value": "small",
"name": "Small"
},
{
"value": "medium",
"name": "Medium"
},
{
"value": "large",
"name": "Large"
}
]
},
"defaultValue": "medium",
"description": "Choose the button size."
},
{
"id": "buttonColor",
"name": "Button color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the button color."
},
{
"id": "buttonTextColor",
"name": "Button label color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the button label color."
},
{
"id": "buttonCaptionColor",
"name": "Caption color",
"type": "static-html",
"staticHtml": {
"content": ""
},
"description": "Set the button caption color."
}
]
},
{
"id": "pictureComplexGroup",
"complexGroup": "picture",
"name": "Picture",
"properties": [
{
"id": "pictureEnable",
"name": "Show picture",
"type": "toggle",
"defaultValue": true,
"description": "Turn on/off the picture.",
"element": "picture"
}
]
}
]
},
"defaultValue": [
{
"complexGroup": "title",
"name": "Title",
"titleEnable": true,
"titleCaptionColor": "",
"titleTextColor": "",
"titleFontSize": 24,
"titleFontWeight": 400
},
{
"complexGroup": "features",
"name": "Features",
"featuresEnable": true,
"featuresStyle": "clean",
"featuresIconColor": "",
"featuresTextColor": ""
},
{
"complexGroup": "price",
"name": "Price",
"priceEnable": true,
"priceCaptionColor": "",
"priceTextColor": "",
"priceFontSize": 32,
"priceFontWeight": 600
},
{
"complexGroup": "button",
"name": "Button",
"buttonEnable": true,
"buttonType": "outline",
"buttonColor": "",
"buttonTextColor": "",
"buttonSize": "medium",
"buttonCaptionColor": ""
},
{
"complexGroup": "picture",
"name": "Picture",
"pictureEnable": true
}
],
"description": "Arrange the elements to be displayed for each columns, and their order."
}
]
}
}