{{ attach_library('goizueta_theme/toggle-buttons') }}
<div class="toggle-buttons" id="{{ id }}">
  {% for button in buttons %}
  <div class="toggle-button-wrapper">
    <style>
      #{{ button.id }} {
        background-size: {{ button.background_size }};
        background-image: {{ button.background_image }};
      }
      #{{ button.id }}.active {
        background-image: {{ button.background_image_active }};
      }
      }
    </style>
    {% set button_class = button.classes ? "toggle-button " ~ button.classes : "toggle-button" %}
    <button id="{{ button.id }}" class="{{ button_class }}" title="{{ button.title }}"
      data-delta="{{ loop.index }}"
      name="{{ button.name }}" aria-label="{{ button.label }}"></button>
  </div>
  {% endfor %}
</div>