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

{% block body %}
    <p class="mt-3">
        <h3>Bienvenue sur le site de MediaTek86 consacré aux formations en ligne</h3>
    </p>
    <p class="mt-3">
        Vous allez pouvoir vous former à différents outils numériques gratuitement et directement en ligne.<br />
        Dans la partie <strong><a href="{{ path('formations') }}" class="link-info">Formations</a></strong>, vous trouverez la liste des formations proposées.
        Vous pourrez faire des recherches et des tris. 
        En cliquant sur la capture, vous accèderez à la présentation plus détaillée de la formation ainsi que la vidéo correspondante.<BR />
        Vous pouvez aussi retrouver les vidéos regroupées dans des playlists, dans la partie <strong><a href="{{ path('playlists') }}" class="link-info">Playlists</a></strong>.
    </p>
    <p>
        Voici les <strong>deux dernières formations</strong> ajoutées au catalogue :
        <table class="table">
            <tr>
                {% for formation in formations %}
                    <td>
                        <div class="row">
                            <div class="col">
                                <!-- emplacement photo -->
                                {% if formation.picture %}
                                    <a href="{{ path('formations.showone', {id:formation.id}) }}">
                                    <img src="{{ formation.picture }}" 
                                         class="card-img-top" style="width:100%;height:auto;" alt="{{ formation.title }}">
                                    </a>    
                                {% endif %}
                            </div>
                            <div class="col">
                                <p>{{ formation.publishedatstring }}</p>
                                <h5 class="text-info mt-1">
                                    {{ formation.title }}
                                </h5>
                                <strong>playlist : </strong>{{ formation.playlist.name }}<br />
                                <strong>catégories : </strong> 
                                {% for categorie in formation.categories %}
                                    {{ categorie.name }}&nbsp;
                                {% endfor %}
                            </div>    
                        </div>                    
                {% endfor %}    
            </tr>

        </table>        
    </p>
{% endblock %}