Skip to content

Dropdown

Vinicius Reif Biavatti edited this page Sep 9, 2019 · 2 revisions

Description

Dropdowns are a list of action options like selects on some element. Its is normally used in navbars or buttons. Check the Turbo Vision example in Examples page for a navbar example using dropdowns.

Code Examples

These are some examples for component:

<!-- Button dropdown -->
<li class="tui-dropdown">
    <button class="tui-button">Dropdown</button>
    <div class="tui-dropdown-content">
        <ul>
            <li><a href="#!">Option</a></li>
        </ul>
    </div>
</li>

<!-- Navbar dropdown -->
<nav class="tui-nav">
    <ul>
        <li class="tui-dropdown">
            <span>Menu</span>
	    <div class="tui-dropdown-content">
		...
	    </div>
	</li>
    </ul>
</nav>

Component Classes

This is the table with available classes for this component.

Class Description
.tui-dropdown Creates a dropdown action
.tui-dropdown-content Defines the content of dropdown
Clone this wiki locally