Super Elements

  2. Home
  4. Docs
  6. Super Elements
  8. Super Elements Modules
  10. Super Multi Switcher

Super Multi Switcher

Super Multi Switcher Module Sample.

Super Multi Switcher


Content

Super Multi Switcher Content

Content Settings

  • Layout Type – There are 2 predefined layout type. Horizontal-Top will appear before the table & Horizontal-Bottom will appear after the table.
  • ADD ITEM – Click the ADD ITEM button to add an item (e.g. Monthly, Yearly).
  • Edit an Item – Click an item to set Icon, Title, Sub-Title, Animation, Content Type and choose a pre-designed pricing table template.

Style

Super Multi Switcher Style

Grid Style

  • Margin – You can input the values for the margins in the required fields.
  • Padding – Here you can set the preferable custom padding. Fill in the values for the top, bottom, right and left padding.
  • Background Type – Here user will be able to select the background type.
  • Border Type – Here user can select the type of the border. The various option is available as like solid, dotted, dashed, groove etc..
  • Border Radius – User will input border radius here. It can be in px or %.
  • Box Shadow – Here you can add some shadow to the box

Switch Title Container Style

  • Margin – You can input the values for the margins in the required fields.
  • Padding – Here you can set the preferable custom padding. Fill in the values for the top, bottom, right and left padding.
  • Background Type – Here user will select the type of background. It can be one color, image or gradient.
  • Border Type – Here user can select the type of the border. The various option is available as like solid, dotted, dashed, groove etc..
  • Border Radius – User will input border radius here. It can be in px or %.
  • First / Last Tabb Border Radius –
  • Box Shadow – Here you can add some shadow to the box.
  • Title Box Position – Here user will select the position for the Title box.

Switch Title Style

  • Title Typography – From Here user can select and define the Font family, size, weight, transform, style, decoration, line height, and letter spacing.
  • Sub Title Typography – From Here user can select and define the Font family, size, weight, transform, style, decoration, line height, and letter spacing.
  • Title Box Content Alignment – Here user will select the title box content alignment.
  • Title/Sub Title Alignment – Here user will select the Title / Sub Title alignment.
  • Min Width – Here user will select the minimum width.
  • Title Icon Position – Here user will select the title icon position.
  • Icon Size – Here user will select the icon size.
  • Icon Gap – User will be able to select the icon Gap here.
  • Icon Vertical Position– User will be able to select the vertical position for the icon.
  • Margin – You can input the values for the margins in the required fields.
  • Padding – Here you can set the preferable custom padding. Fill in the values for the top, bottom, right and left padding.
  • Background Type – Here user will select the type of background. It can be one color, image or gradient.
  • Color – User will select the background color here.
  • Image – User will select an image here if image background is needed.
  • Text Background Type – Here user will select the type of text background. It can be one color, image or gradient
  • Color – User will select the text color here.
  • Image – User will select if image background is needed for the text.
  • Icon Color – User will choose Icon color from here.
  • Sub Title Color – You can select subtitle color from here.
  • Border Type – Here user can select the type of the border. The various option is available as like solid, dotted, dashed, groove etc..
  • Width – User will border width from here.
  • Color – User will be able to select border color from here.
  • Border Radius – User will input border radius here. It can be in px or %.
  • Box Shadow – Here you can add some shadow to the box

Switch Body Container Style

  • Body Margin – You can input the values for the margins in the required fields.
  • Body Padding – Here you can set the preferable custom padding. Fill in the values for the top, bottom, right and left padding.
  • Body Background Type – Here you can select the Body Background Type. It can be color, gradient, image.
  • Border Type – Here user can select the type of the border. Various option is available as like solid, dotted, dashed, groove etc..
  • Border Radius – User will input border radius here. It can be in px or %.
  • Box Shadow – Here you can add some shadow to the box

Switch Body Style

  • Tab Content Background Color – Here you can select the tab background color.
  • Text Color – User will select the text color from here.
  • Typography – From Here user can select and define the Font family, size, weight, transform, style, decoration, line height, and letter spacing.
  • Padding – Here you can set the preferable custom padding. Fill in the values for the top, bottom, right and left padding.
  • Margin – You can input the values for the margins in the required fields.
  • Border Type – Here user can select the type of the border. The various option is available as like solid, dotted, dashed, groove etc..
  • Border Radius – User will input border radius here. It can be in px or %.
  • Content Box Shadow – Here you can add some shadow to the box