Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-07-29 14:34:37 +04:00
Code Issues Projects Releases Wiki Activity

dropdowns page

Browse Source
This commit is contained in:
codecalm
2019-10-22 23:32:28 +02:00
parent 976072b9ad
commit 2ce1182e86
4 changed files with 82 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/_includes/ui/dropdown-menu.html
+24 -9
View File
@@ -1,10 +1,25 @@
{% assign items = include.items | default: "Action|Another action|Something else|-|Separated link" | split: "|" %}
<div class="dropdown-menu{% if include.right %} dropdown-menu-right{% endif %}">
{% for item in items %}
{% if item == '-' %}
<div class="dropdown-divider"></div>
{% else %}
<a class="dropdown-item" href="javascript:void(0)">{{ item }}</a>
{% endif %}
{% endfor %}
<div class="dropdown-menu{% if include.right %} dropdown-menu-right{% endif %}{% if include.show %} position-relative d-inline-block{% endif %}{% if include.arrow %} dropdown-menu-arrow{% endif %}{% if include.dark %} bg-dark text-white{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
{% if include.check or include.radio %}
{% for i in (1..3) %}
<label class="dropdown-item"><input class="form-check-input m-0 mr-2" type="{% if include.radio %}radio{% else %}checkbox{% endif %}"> Option {{ i }}</label>
{% endfor %}
{% elsif include.type == 'text' %}
{% else %}
{% if include.header %}<span class="dropdown-header">Dropdown header</span>{% endif %}
<a class="dropdown-item" href="#">
{% if include.icons %}{% include ui/icon.html icon="settings" %} {% endif %}
Action
{% if include.badge %}<span class="badge bg-primary ml-auto">12</span>{% endif %}
</a>
<a class="dropdown-item" href="#">
{% if include.icons %}{% include ui/icon.html icon="edit" %} {% endif %}Another action
</a>
{% if include.active %}<a class="dropdown-item active" href="#">{% if include.icons %}{% include ui/icon.html icon="activity" %} {% endif %}Active action</a>{% endif %}
{% if include.disabled %}<a class="dropdown-item disabled" href="#">{% if include.icons %}{% include ui/icon.html icon="user-x" %} {% endif %}Disabled action</a>{% endif %}
{% if include.separated %}
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">{% if include.icons %}{% include ui/icon.html icon="plus" class="dropdown-icon" %} {% endif %}Separated link</a>
{% endif %}
{% endif %}
</div>
pages/dropdowns.html
+19
View File
@@ -0,0 +1,19 @@
---
title: Dropdowns
page-title: Dropdowns
---
{% include_cached ui/dropdown-menu.html show=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true separated=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true active=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true disabled=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true header=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true icons=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true icons=true header=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true dark=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true right=true dark=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true right=true dark=true icons=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true badge=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true check=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true radio=true class="mr-3 mb-3 align-top" %}