{% extends "base.html.twig" %}

{% block localstyle %}
    hr { margin:5px 0px 5px 0px; }
{% endblock %}

{% block body %}
    <div class="mt-1 mb-3">
        <a class="btn btn-success btn-sm" href={{ path('app_scrum_submit') }}><i class="fa fa-plus mr-2"></i>Ajouter un Scrum</a>
    </div>

    <div id="grid" class="margin:auto">
    
        {% for scrum in scrums %}
        <div class="card float-left mb-1 mr-1" style="width:374px">
            <div class="card-header">
                <a href="{{path('app_scrum_view',{id:scrum.id})}}">{{scrum.name}}</a>
                <a class="float-right" href="{{path('app_scrum_update',{id:scrum.id})}}"><i class="fas fa-file"></i></a>
            </div>

            <div class="card-body">
                <small>
                    <p style="min-height:35px">
                    {{scrum.giteajson.description}}</p>
                    Nombre de tickets = {{ scrum.scrumissues|length}}<br>
                    {% for statistique in scrum.statistique %}
                        {% if loop.first %}<hr>{%endif%}
                        {{ statistique[0] }} = {{ statistique[1] }}<br>
                    {% endfor %}
                    
                </small>
            </div>

            <div class="card-footer small">
                <a href="{{scrum.giteajson.html_url}}" target="_blank"">{{scrum.giteajson.html_url}}</a>
            </div>
        </div>
    {% endfor %}
{% endblock %}

{% block localjavascript %}
    $(document).ready(function() {
        $('#grid').masonry({
            itemSelector: '.card',
        });
    });
{% endblock %}