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

{% block title %}Nouvelle {{ chant.titre }}{% endblock %}

{% block meta_description %}
    {{ chant.titre }}
{% endblock %}

{% block titrepage %}
    {{ chant.titre }}
{% endblock %}

{% block body %}
    <div class="row">
    <div class="col-md-4">
        <h2>
            {{ chant.titre }}
        </h2>
        <p>
           <span>Auteur : </span> {{ chant.auteur }}
        </p>
        <p>
            <span>Compositeur : </span> {{ chant.compositeur }}
        </p>
        <p>
            <span>Arrangeur : </span> {{ chant.arrangeur }}
        </p>
    </div>
    <div class="col-md-8">
        <div class="card shadow mb-4">
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-bordered" id="dataTable">
                        <thead>
                        <tr>
                            <th>Voix</th>
                            <th>Type</th>
                            <th>Fichier</th>
                        </tr>
                        </thead>
                        <tbody>
                        {% for ap in aps %}
                            <tr>
                                <td>
                                    {{ ap.voix }}
                                </td>
                                <td>{{ ap.genre }}</td>
                                <td><a href="/images/audio-partition/{{ ap.documentNom }}"> {{ ap.documentNom }}</a></td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    </div>
        <hr>
        <a href="{{ path('chant.liste') }}" class="btn btn-outline-primary">Retour</a>
{% endblock %}