{% load toolbar_tags %}
<div class="toolbar" xmlns:ui="http://nowoczesnapolska.org.pl/platforma/ui">

    <div class="toolbar-tabs-container">
    <p>
        {% for group in groups %}
        <button ui:group="{{ group.slug }}" {% if forloop.first %}class="active"{% endif %}>
            {{ group.name }}
        </button>
        {% endfor %}
    </p>
    </div>

    <div class="toolbar-button-groups-container">
        {% for group in groups %}        
        <p ui:group="{{group.slug}}" class="toolbar-buttons-container" {% if not forloop.first %}style="display:none;"{% endif %}>
            {# buttons for this group #}            
            {% for button in group.button_set.all %}
            <button type="button" 
                ui:action="{{ button.action }}" 
                ui:hotkey="{{ button.key|keycode }}" >
            {{ button.label }}
            </button>
            {% endfor %}
        </p>
        {% endfor %}
    </div>

</div>