buttons

Information

Folder
src/components/patterns/buttons

Files

Schema
Mocks
Template
// src/components/patterns/buttons/buttons.html.twig

<div class="Buttons Tracking--buttons{% if not embedded %} u-container{% endif %}{% if class %} {{ class }}{% endif %}">
  {% for item in buttons %}
    {% if item.type == "button" %}
      {% include "@elements/button/button.html.twig" with {
        class: item.class ? "Buttons-button " ~ item.class : "Buttons-button",
        label: item.label,
        mutation: item.mutation,
        target: item.target,
        tenant: tenant,
        url: item.url
      } only %}
    {% elseif item.type == "link" %}
      {% include "@elements/link/link.html.twig" with {
        class: item.class ? "Buttons-button " ~ item.class : "Buttons-button",
        icon: "minus",
        icon_left: true,
        label: item.label,
        target: item.target,
        tenant: tenant,
        url: item.url
      } only %}
    {% endif %}
  {% endfor %}
</div>

Variants

Button primary
Open

Button primary mock data

Raw
Resolved
Button secondary
Open

Button secondary mock data

Raw
Resolved
Button tertiary link
Open

Button tertiary link mock data

Raw
Resolved
Button primary and Link
Open

Button primary and Link mock data

Raw
Resolved
Button secondary and Link
Open

Button secondary and Link mock data

Raw
Resolved
Button donation
Open

Button donation mock data

Raw
Resolved
Button donation and Link
Open

Button donation and Link mock data

Raw
Resolved
Kids Button primary and Link
Open

Kids Button primary and Link mock data

Raw
Resolved