1
0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Files
tabler/_includes/cards/form-dropdown-groups.html
2018-02-19 20:17:04 +01:00

88 lines
3.3 KiB
HTML

<div class="card">
<div class="card-header">
<h3 class="card-title">Dropdown Groups</h3>
</div>
<div class="card-body">
<div class="form-group">
<div class="input-group">
<div class="input-group-btn">
<button type="button" class="btn btn-secondary">Options</button>
<button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown"></button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-bell mr-5"></i>News
</a>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-envelope-o mr-5"></i>Messages
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-pencil mr-5"></i>Edit Profile
</a>
</div>
</div>
<input type="text" class="form-control" id="example-input1-group3" name="example-input1-group3" placeholder="Username">
</div>
</div>
<div class="form-group ">
<div class="input-group">
<input type="email" class="form-control" id="example-input2-group3" name="example-input2-group3" placeholder="Email">
<div class="input-group-btn">
<button type="button" class="btn btn-secondary" data-toggle="dropdown" >
<i class="fa fa-angle-down"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-bell mr-5"></i>News
</a>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-envelope-o mr-5"></i>Messages
</a>
</div>
</div>
</div>
</div>
<div class="form-group ">
<div class="input-group">
<div class="input-group-btn dropup">
<button type="button" class="btn btn-secondary" data-toggle="dropdown" >
<i class="fa fa-angle-up"></i>
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-bell mr-5"></i>News
</a>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-envelope-o mr-5"></i>Messages
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-pencil mr-5"></i>Edit Profile
</a>
</div>
</div>
<input type="text" class="form-control" id="example-input3-group3" name="example-input3-group3" placeholder="..">
<div class="input-group-btn dropup">
<button type="button" class="btn btn-secondary" data-toggle="dropdown" >
<i class="fa fa-angle-up"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-bell mr-5"></i>News
</a>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-envelope-o mr-5"></i>Messages
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="javascript:void(0)">
<i class="fa fa-fw fa-pencil mr-5"></i>Edit Profile
</a>
</div>
</div>
</div>
</div>
<div class="form-footer">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</div>