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

{% block title %}Accueil{% endblock %}

{% block customNavigation %}
    {% include "base/nav-empty.html.twig" %}
{% endblock %}

{% block body %}

    <div class="row">
        <div class="col-lg-2 col-xs-12"></div>
        <div class="col-lg-8 col-xs-12">
            <p></p>

            <div class="row row-cols-1 row-cols-md-2 g-4">

                <div class="col">
                    <div class="card mb-3" style="max-width: 540px;" style="">
                        <div class="row g-0" >
                            <div class="col-md-4 d-none d-sm-block" align="center">
                                <br />
                                <img src="/images/bebe-blond-seul.png" class="img-fluid rounded-start" alt="Dashboars" width="80%" height="auto">
                            </div>
                            <div class="col-md-8" style="border-left:1px solid rgba(0, 0, 0, 0.125);">
                                <div class="card-body">
                                    <h5 class="card-title">Dashboard</h5>
                                    <p class="card-text">Système d'administration du contenu.<br />
                                    </p>
                                    <hr width="100%"/>
                                    <p style="font-size:10px;font-style:italic;">
                                        <strong>En cours de développement</strong>
                                        <ul style="font-size:10px;font-style:italic;">
                                            <li>Gestion des mamans / bébés / questionnaires ...</li>
                                            <li>Connection à Stripe</li>
                                            <li>Permettre actualisation pour tous</li>
                                            <li>CRON automatique</li>
                                            <li>Changement mot de passe</li>
                                            <li>Améliorer temps de chargement</li>
                                        </ul>
                                    </p>
                                    <hr width="100%"/>
                                    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                                        <a href="/admin" class="btn btn-primary me-md-2" style="border-radius: unset;color:white;text-transform:uppercase;" >y aller</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>


                <div class="col">
                    <div class="card mb-3" style="max-width: 540px;">
                        <div class="row g-0" >
                            <div class="col-md-4 d-none d-sm-block" align="center">
                                <br />
                                <img src="/images/bebe01.png" class="img-fluid rounded-start" alt="Dashboars" width="80%" height="auto">
                            </div>
                            <div class="col-md-8" style="border-left:1px solid rgba(0, 0, 0, 0.125);">
                                <div class="card-body">
                                    <h5 class="card-title">Ateliers</h5>
                                    <p class="card-text">Gestion des différents ateliers. <br /></p>
                                    <hr width="100%"/>
                                    <p style="font-size:10px;font-style:italic;">
                                        <strong>En cours de développement</strong>
                                        <ul style="font-size:10px;font-style:italic;">
                                            <li>Upload des replays</li>
                                            <li>Gestion des réservations (export + places restantes)</li>
                                            <li>Gestion des mailings automatique</li>
                                            <li>Permettre la duplication</li>
                                            <li>Changement mot de passe</li>
                                        </ul>
                                    </p>
                                    <hr width="100%"/>
                                    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                                        <a href="/teachers" class="btn btn-info me-md-2" style="border-radius: unset;color:white;text-transform:uppercase;" >y aller</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col">
                    <div class="card mb-3" style="max-width: 540px;">
                        <div class="row g-0" >
                            <div class="col-md-4 d-none d-sm-block" align="center">
                                <br />
                                <img src="/images/bebe02.png" class="img-fluid rounded-start" alt="Dashboars" width="80%" height="auto">
                            </div>
                            <div class="col-md-8" style="border-left:1px solid rgba(0, 0, 0, 0.125);">
                                <div class="card-body">
                                    <h5 class="card-title">CBA</h5>
                                    <p class="card-text">Affichage du contenu des différents mois.</p>
                                    <hr width="100%"/>
                                    <p style="font-size:10px;font-style:italic;">
                                        <strong>En cours de développement</strong>
                                        <ul style="font-size:10px;font-style:italic;">
                                            <li>Vérification quiz de départ</li>
                                            <li>Changement mot de passe</li>
                                            <li>Améliorer temps de chargement</li>
                                            <li>Gestion abonnement</li>
                                            <li>Mettre à jour contenu Kids</li>
                                            <li>Mettre à jour vidéo présentation Apprentissage</li>
                                        </ul>
                                    </p>
                                    <hr width="100%"/>
                                    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                                        <a href="/classes" class="btn btn-warning me-md-2" style="border-radius: unset;color:white;text-transform:uppercase;" >y aller</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                
            </div>

            

        </div>
        <div class="col-lg-2 col-xs-12"></div>
    </div>

{% endblock %}