I am trying to create a dropdown login form for a website using the Semantic UI framework, and can't figure out if there is a better way to make it. Currently, the form is in an item on the menu, so when you click on it the dropdown menu disappears. This is my code now:
<div class="ui dropdown">Login
<div class="dropdown menu">
<div class="item">
<form class="ui form">
<div class="ui stacked segment">
<div class="ui one column middle aligned very relaxed stackable grid">
<div class="column">
<div class="ui form">
<div class="field">
<label>Username</label>
<div class="ui left icon input">
<input placeholder="Username" type="text">
<i class="icon-user-tie icon"></i>
</div>
</div>
<div class="field">
<label>Password</label>
<div class="ui left icon input">
<input placeholder="Password" type="password">
<i class="icon-lock icon"></i>
</div>
</div>
<div class="ui blue submit button">Login</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
Is there another way to add the form to the dropdown without making it an actual item on the dropdown menu? Thanks!