Elements
These modular elements can be readily used and customized across pages and in different blocks.
Theme Accordions <> show code
<div id="ex-accordion" class="th-accordions" data-children=".item">
<div class="item">
<a data-toggle="collapse" class="collapse-bar" data-parent="#ex-accordion" href="#ex-accordion1" aria-expanded="true" aria-controls="ex-accordion1">
<i class="fa fa-database" aria-hidden="true"></i> Meet Our Team
</a>
<div id="ex-accordion1" class="collapse show tab-pane" role="tabpanel">
<p class="">
Any accordion contents goes here ..
</p>
</div>
</div>
</div>
how to use
- Use class .th-accordions with accrdion wrapper for the style as shown in the examples.
- If you want to show multiple collapse items at the same time use common data-parent="" id for all clild items
Example 1:
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Example 2:
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque, magni non repellat nulla sapiente, totam quisquam voluptate numquam quia ipsa incidunt minus hic! Fugit voluptatem fugiat dicta labore, suscipit officia pariatur natus possimus, nemo cupiditate nam ratione sapiente rerum facilis voluptatibus excepturi, reprehenderit quo debitis? Obcaecati natus ipsa dicta dolor.