1
0
mirror of https://github.com/tabler/tabler.git synced 2026-07-29 14:34:37 +04:00

badges docs fulfilled

This commit is contained in:
Dawid Harat
2019-12-08 20:02:16 +01:00
parent 0b257000c5
commit 9846504339
+8
View File
@@ -16,6 +16,8 @@ A small count and labeling component. Please read the [official Bootstrap docume
### Pill badges
To make a pill bagde (with rounded corners) add `.bagde-pill` class.
{% example %}
{% for color in site.colors %}
<span class="badge badge-pill bg-{{ color[0] }}">{{ forloop.index }}</span>
@@ -25,6 +27,8 @@ A small count and labeling component. Please read the [official Bootstrap docume
### Soft badges
Creates a soft variant of a corresponding contextual badge variation. You can click [here]({% docs_url colors %}) to see the list of available colors.
{% example %}
{% for color in site.colors %}
<span class="badge bg-{{ color[0] }}-lt">{{ color[0] }}</span>
@@ -34,6 +38,8 @@ A small count and labeling component. Please read the [official Bootstrap docume
### Links
Make a badge work as a link by putting it into an `<a>` element.
{% example %}
{% for color in site.colors %}
<a href="#" class="badge bg-{{ color[0] }}">{{ color[0] }}</a>
@@ -43,6 +49,8 @@ A small count and labeling component. Please read the [official Bootstrap docume
### Empty badges
If you don't want your badge to contain any text you can do it by leaving the html element empty.
{% example %}
{% for color in site.colors %}
<a href="#" class="badge bg-{{ color[0] }}"></a>