OffHealth component library

Chip 

<a href="#" class="n7-chip  n7-chip--interactive n7-chip--interactive n7-chip--sm">
    <svg class="inline-block align-middle fill-current w-4 h-4 mr-1" aria-hidden="true" focusable="false" role="img">
        <use xlink:href="../../icons.svg#mini--tag" />
    </svg>

    Label</a>
 
<{% if href %}a href="{{ href }}"{% else %}span{% endif %} class="n7-chip {% if href %} n7-chip--interactive{% endif %}{% block classes %}{% if class %} {{ class }}{%- endif -%}{% endblock %}">
    {%- block icon -%}
        {% if icon %}
            {% render '@icon--small', { id: icon, classes: 'mr-1' }, true %}
        {% endif %}
    {%- endblock -%}
    {%- block content -%}
        {% if label %}{{ label }}{% else %}Label{% endif %}
    {%- endblock -%}
    {%- block close -%}
        {% if hasBtnClose %}
            <button class="inline-flex">
                {% render '@icon--small', { id: 'mini--x-mark', size: 'w-5 h-5', classes: 'ml-2' }, true %}
                <span class="sr-only">Rimuovi</span>
            </button>
        {% endif %}
    {%- endblock -%}
</{% if href %}a{% else %}span{% endif %}>
 
{
  "class": "n7-chip--interactive n7-chip--sm",
  "href": "#",
  "icon": "mini--tag"
}

No notes defined.