fbpx

UI Elements

[row]

[col size=”6″]

[heading element=”h4″ remove_margins=”top”]Tabs[/heading]

[tabs]

[tab title=”First Tab”]Cras congue lectus vitae tristique viverra. Vestibulum vitae arcu turpis. Sed condimentum fermentum efficitur.[/tab]

[tab title=”Second Tab”]Donec ornare lectus eu neque consequat iaculis. In suscipit metus ac lectus sollicitudin, in gravida ipsum interdum.[/tab]

[tab title=”Third Tab”]Mauris nibh dolor, suscipit vel massa bibendum, mollis euismod diam. Nullam consectetur, urna vitae lacinia iaculis, lacus ligula tincidunt urna, ac pretium urna magna ut metus.[/tab]

[/tabs]

[/col]

[col size=”6″]

[heading element=”h4″ remove_margins=”top”]Pills[/heading]

[tabs type=”pills”]

[tab title=”First Tab”]Cras congue lectus vitae tristique viverra. Vestibulum vitae arcu turpis. Sed condimentum fermentum efficitur.[/tab]

[tab title=”Second Tab”]Donec ornare lectus eu neque consequat iaculis. In suscipit metus ac lectus sollicitudin, in gravida ipsum interdum.[/tab]

[tab title=”Third Tab”]Mauris nibh dolor, suscipit vel massa bibendum, mollis euismod diam. Nullam consectetur, urna vitae lacinia iaculis, lacus ligula tincidunt urna, ac pretium urna magna ut metus.[/tab]

[/tabs]

[/col]

[/row]

[row]

[col size=”6″]

[heading element=”h4″ remove_margins=”top”]Accordion[/heading]

[accordion]

[accordion_group title=”First Section”]Mauris nibh dolor, suscipit vel massa bibendum, mollis euismod diam. Nullam consectetur, urna vitae lacinia iaculis, lacus ligula tincidunt urna, ac pretium urna magna ut metus. Donec fermentum arcu ac tellus elementum, fermentum sollicitudin eros sodales.[/accordion_group]

[accordion_group title=”Second Section”]Donec ornare lectus eu neque consequat iaculis. In suscipit metus ac lectus sollicitudin, in gravida ipsum interdum. Curabitur sed malesuada neque, at mattis turpis. In ut tortor malesuada, semper elit at, tincidunt lacus. Cras dictum velit at ipsum accumsan tincidunt a eget orci.[/accordion_group]

[accordion_group title=”Third Section”]Cras congue lectus vitae tristique viverra. Vestibulum vitae arcu turpis. Sed condimentum fermentum efficitur. Fusce nec faucibus nunc, ac tincidunt arcu. Sed mattis massa quis condimentum vulputate. Donec mauris est, ultricies ut massa ac, ornare dapibus mauris.[/accordion_group]

[/accordion]

[/col]

[col size=”6″]

[heading element=”h4″ remove_margins=”top”]Toggles[/heading]

[accordion behavior=”toggle”]

[accordion_group title=”First Section”]Mauris nibh dolor, suscipit vel massa bibendum, mollis euismod diam. Nullam consectetur, urna vitae lacinia iaculis, lacus ligula tincidunt urna, ac pretium urna magna ut metus. Donec fermentum arcu ac tellus elementum, fermentum sollicitudin eros sodales.[/accordion_group]

[accordion_group title=”Second Section”]Donec ornare lectus eu neque consequat iaculis. In suscipit metus ac lectus sollicitudin, in gravida ipsum interdum. Curabitur sed malesuada neque, at mattis turpis. In ut tortor malesuada, semper elit at, tincidunt lacus. Cras dictum velit at ipsum accumsan tincidunt a eget orci.[/accordion_group]

[accordion_group title=”Third Section”]Cras congue lectus vitae tristique viverra. Vestibulum vitae arcu turpis. Sed condimentum fermentum efficitur. Fusce nec faucibus nunc, ac tincidunt arcu. Sed mattis massa quis condimentum vulputate. Donec mauris est, ultricies ut massa ac, ornare dapibus mauris.[/accordion_group]

[/accordion]

[/col]

[/row]

[row]

[col size=”12″]

[heading element=”h4″ remove_margins=”top”]Buttons[/heading]

[text_widget]

[button type=”default” size=”xs” url=”#”]Default[/button] [button type=”primary” size=”xs” url=”#”]Primary[/button] [button type=”success” size=”xs” url=”#”]Success[/button] [button type=”warning” size=”xs” url=”#”]Warning[/button] [button type=”danger” size=”xs” url=”#”]Danger[/button] [button type=”info” size=”xs” url=”#”]Info[/button]

[button type=”default” size=”sm” url=”#”]Default[/button] [button type=”primary” size=”sm” url=”#”]Primary[/button] [button type=”success” size=”sm” url=”#”]Success[/button] [button type=”warning” size=”sm” url=”#”]Warning[/button] [button type=”danger” size=”sm” url=”#”]Danger[/button] [button type=”info” size=”sm” url=”#”]Info[/button]

[button type=”default” size=”0″ url=”#”]Default[/button] [button type=”primary” size=”0″ url=”#”]Primary[/button] [button type=”success” size=”0″ url=”#”]Success[/button] [button type=”warning” size=”0″ url=”#”]Warning[/button] [button type=”danger” size=”0″ url=”#”]Danger[/button] [button type=”info” size=”0″ url=”#”]Info[/button]

[button type=”default” size=”lg” url=”#”]Default[/button] [button type=”primary” size=”lg” url=”#”]Primary[/button] [button type=”success” size=”lg” url=”#”]Success[/button] [button type=”warning” size=”lg” url=”#”]Warning[/button] [button type=”danger” size=”lg” url=”#”]Danger[/button] [button type=”info” size=”lg” url=”#”]Info[/button]

[/text_widget]

[heading element=”h4″]Alerts[/heading]

[alert title=”Alert Success” type=”success”]This is an alert box for showing a success message.[/alert]

[alert title=”Alert Warning” type=”warning”]This is an alert box for showing a warning message.[/alert]

[alert title=”Alert Danger” type=”danger”]This is an alert box for showing a danger message.[/alert]

[alert title=”Alert Info” type=”info”]This is an alert box for showing an info message.[/alert]

[heading element=”h4″]Progressbars[/heading]

[progressbar label=”Photography” value=”15″][/progressbar]

[progressbar label=”Web Design” type=”success” value=”34″][/progressbar]

[progressbar label=”Branding” type=”info” value=”54″][/progressbar]

[progressbar label=”Graphic Design” type=”warning” value=”79″][/progressbar]

[progressbar label=”SEO” type=”danger” value=”37″][/progressbar]

[heading element=”h4″ style=”bordered”]Pricing Tables[/heading]

[/col]

[/row]

[row]

[col size=”4″]

[pricing_table title=”Free” price_description=”Students, Non-profits” btn_action=”page” post_id=”2802″ btn_text=”Start Now” color=”primary”]

  • Unlimited Designs
  • 24/7 Support
  • Free VPS Hosting
  • Daily Backups
  • Lifetime Warranty

[/pricing_table]

[/col]

[col size=”4″]

[pricing_table title=”Basic” price=”200″ price_description=”Web Designers, Developers” btn_action=”page” post_id=”2802″ btn_text=”Start Now” color=”primary” featured=”1″]

  • Unlimited Designs
  • 24/7 Support
  • Free VPS Hosting
  • Daily Backups
  • Lifetime Warranty

[/pricing_table]

[/col]

[col size=”4″]

[pricing_table title=”Professional” price=”599″ btn_action=”page” post_id=”2802″ btn_text=”Start Now” color=”primary”]

  • Unlimited Designs
  • 24/7 Support
  • Free VPS Hosting
  • Daily Backups
  • Lifetime Warranty

[/pricing_table]

[/col]

[/row]

Post a Comment

Your email address will not be published. Required fields are marked *