Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Code Issues Projects Releases Wiki Activity

buttons, tooltips

Browse Source
This commit is contained in:
chomik
2019-04-13 20:02:52 +02:00
parent 0be994b2bb
commit babbf8af6c
7 changed files with 38 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
_config.yml
View File

@@ -106,4 +106,4 @@ docs-menu:
- title: Getting started
pages: [index]
- title: Components
pages: [avatars, badges, buttons]
pages: [avatars, badges, buttons, tooltips]

3
pages/_docs/avatars.md
View File

@@ -1,8 +1,9 @@
---
title: Avatars
description: Create and group avatars of various shapes and sizes with one component.
---
Create and group avatars of various shapes and sizes with one component.
### Default markup
{% example html wrapper=avatar-list %}

2
pages/_docs/badges.md
View File

@@ -2,6 +2,8 @@
title: Badges
---
A small count and labeling component. Please read the [official Bootstrap documentation](https://getbootstrap.com/docs/4.3/components/badge/) for a full list of options.
### Default markup
{% example html %}

13
pages/_docs/buttons.md Normal file
View File

@@ -0,0 +1,13 @@
---
title: Buttons
---
### Default markup
{% example html wrapper=btn-list %}
{% include ui/button.html color="primary" text="Button" %}
{% include ui/button.html color="secondary" text="Button" %}
{% include ui/button.html color="danger" text="Button" %}
{% include ui/button.html color="warning" text="Button" %}
{% include ui/button.html color="success" text="Button" %}
{% endexample %}

18
pages/_docs/tooltips.md Normal file
View File

@@ -0,0 +1,18 @@
---
title: Tooltips
---
{% example html wrapper=btn-list %}
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
Tooltip on top
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="right" title="Tooltip on right">
Tooltip on right
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">
Tooltip on bottom
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip on left">
Tooltip on left
</button>
{% endexample %}

2
pages/_includes/ui/button.html
View File

@@ -1 +1 @@
{% assign element = include.element | default: 'button' %}<{{ element }} href="{{ include.href | default: '#' }}" class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.label %} btn-label{% endif %}">{% if include.icon %}{% include ui/icon.html icon=include.icon %}{% endif %}{% if include.label %}<span class="btn-label-icon">{% include ui/icon.html icon=include.label %}</span>{% endif %}{{ include.text }}</{{ element }}>
{% assign element = include.element | default: 'button' %}<{{ element }}{% if element == 'a' %} href="{{ include.href | default: '#' }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.label %} btn-label{% endif %}">{% if include.icon %}{% include ui/icon.html icon=include.icon %}{% endif %}{% if include.label %}<span class="btn-label-icon">{% include ui/icon.html icon=include.label %}</span>{% endif %}{{ include.text }}</{{ element }}>

2
pages/_layouts/docs.html
View File

@@ -17,7 +17,7 @@ page-title: Documentation
<div class="list-group list-group-transparent mb-0">
{% for p in group.pages %}
{% assign doc = site.docs | where: "slug", p | first %}
<a href="{{ site.base }}/{{ doc.url }}" class="list-group-item list-group-item-action{% if page.url == doc.url %} active{% endif %}">
<a href="{{ site.base }}/docs/{{ doc.slug }}.html" class="list-group-item list-group-item-action{% if page.url == doc.url %} active{% endif %}">
{{ doc.title }}
</a>
{% endfor %}