Toggles

Add Toggles to make your Content shorter than it looks. Great to provide your Site Visitor with an Option to Choose to view your Content.

Usage

<div class="toggle">
	<div class="toggle-header">
		<div class="toggle-icon">
			<i class="toggle-closed icon-line-plus"></i>
			<i class="toggle-open icon-line-minus"></i>
		</div>
		<div class="toggle-title">
			This is a Toggle Title
		</div>
	</div>
	<div class="toggle-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda, dolorum, vero ipsum molestiae minima odio quo voluptate illum excepturi quam cum voluptates doloribus quae nisi tempore necessitatibus dolores ducimus enim libero eaque explicabo suscipit animi at quaerat aliquid ex expedita perspiciatis? Saepe, aperiam, nam unde quas beatae vero vitae nulla.</div>
</div>

Settings

Setting	Description
`data-state`	The Display State of the Toggle. Example: `open`
`.toggle-border`	Add this Class to the `.toggle` Element to use Bordered Toggles. Example: `<div class="toggle toggle-border">`
`.toggle-bg`	Add this Class to the `.toggle` Element to use Background Colored Toggles. Example: `<div class="toggle toggle-bg">`

Related docs

Accordions Tabs