37 lines
1.2 KiB
HTML
37 lines
1.2 KiB
HTML
|
{% extends "layouts/minimal.html" %}
|
||
|
|
{% block title %}{_ "Dropdown" _}{% endblock %}
|
||
|
|
{% block content %}
|
||
|
|
|
||
|
|
{% include "dropdown-js.html" :class ".dropdown" %}
|
||
|
|
|
||
|
|
<div class="section">
|
||
|
|
<div class="columns is-centered">
|
||
|
|
<div class="column is-half">
|
||
|
|
<div class="container">
|
||
|
|
<div class="dropdown is-hoverable">
|
||
|
|
<div class="dropdown-trigger">
|
||
|
|
<input class="input" type="text" placeholder="Testing..." aria-haspopup="true" aria-controls="dropdown-menu2">
|
||
|
|
</div>
|
||
|
|
<div class="dropdown-menu" id="dropdown-menu2" role="menu">
|
||
|
|
<div class="dropdown-content">
|
||
|
|
<div class="dropdown-item">
|
||
|
|
<p>You can insert <strong>any type of content</strong> within the dropdown menu.</p>
|
||
|
|
</div>
|
||
|
|
<hr class="dropdown-divider">
|
||
|
|
<div class="dropdown-item">
|
||
|
|
<p>You simply need to use a <code><div></code> instead.</p>
|
||
|
|
</div>
|
||
|
|
<hr class="dropdown-divider">
|
||
|
|
<a href="#" class="dropdown-item">
|
||
|
|
This is a link
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{% endblock %}
|