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

{% block pp %}{{pp}}{% endblock %}

{% block title %}Profile - HearthTrack{% endblock %}

{% block user %}{{user}} - {{role}}{% endblock %}

{% block body %}
<div class="container-fluid px-4">
                        <h1 class="mt-4">Profile</h1>
                        <ol class="breadcrumb mb-4">
            <li class="breadcrumb-item"><a href="/">Accueil</a></li>
            <li class="breadcrumb-item active">Profile</li>
        </ol>
                        <div class="row">
                            <div class="col-3">
                                <div class="card mb-4">
                                    <div class="card-header">
                                        <i class="fas fa-chart-area me-1"></i>
                                        Profile
                                    </div>
                                    <div class="card-body">
                                        <div>
                                            <style> .image-ronde{ clip-path:ellipse(50% 50%);} </style>
                                            <img src="/assets/img/person/{{infoUser.img}}.png" width="250px" height="250px" class="image-ronde" style="
                                                margin-left: 13px;
                                            ">
                                        </div>
                                        <div style="text-align:center; margin-top: 15px;">
                                            Nom : {{infoUser.nom}}
                                        </div>
                                        <div style="text-align:center">
                                            Prénom : {{infoUser.prenom}}
                                        </div>
                                        <div style="text-align:center">
                                            Date de naissance : {{infoUser.dateNaiss}}
                                        </div>
                                        <div style="text-align:center">
                                            Sport favori : {{infoUser.favSport}}
                                        </div>
                                        <div style="text-align:center; margin-bottom: 15px;">
                                            Coach : {{infoUser.coach}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-9">
                                <div class="card mb-4">
                                    <div class="card-header">
                                        <i class="fas fa-chart-bar me-1"></i>
                                        Générale
                                    </div>
                                    <div class="card-body">
                                        <div>
                                            Description : {{infoUser.description}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
{% endblock %}